This has been asked before, but nobody responded, so I ask again as I feel it is important.
Unobtrusive validation for web forms works great, but, only when validation controls are added to a form. For other pages that lack validation controls, no reference to the JQuery file is rendered.
I currently use JQuery on all pages, so reference it manually in a Master page file,
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
The problem is that when I access a page with my own JQuery logic and validation controls, then two references get created (my own, plus ASP.Net's ScriptResourceDefinition).
How can I achieve one of the following:
Let ScriptResourceDefinition know that the file exists and has already been added?
Force ScriptResourceDefinition to render JQuery on every page regardless of whether it detects validation controls?
Found the answer here https://stackoverflow.com/a/12628170/792888
The answer is to inherit from ScriptManager and stop ASP.Net's built-in behaviour of creating the unnecessary (duplicate) JQuery link
using System;
using System.Linq;
using System.Web.UI;
namespace WebApplication46
{
public class CustomScriptManager : ScriptManager
{
protected override void OnInit(EventArgs e)
{
Page.PreRenderComplete += Page_PreRenderComplete;
base.OnInit(e);
}
private void Page_PreRenderComplete(object sender, EventArgs e)
{
var jqueryReferences = Scripts.Where(s => s.Name.Equals("jquery", StringComparison.OrdinalIgnoreCase)).ToList();
if (jqueryReferences.Count > 0)
{
// Remove the jquery references as we're rendering it manually in the master page <head>
foreach (var reference in jqueryReferences)
{
Scripts.Remove(reference);
}
}
}
}
}
In web.config this is wired up to replace the standard ScriptManager:
<system.web>
<pages>
<tagMapping>
<add tagType="System.Web.UI.ScriptManager" mappedTagType="WebApplication46.CustomScriptManager" />
</tagMapping>
</pages>
</system.web>
Related
I am trying to register a custom event I added to a user control.
I can do this in code behind, but not in the aspx file.
What am I doing wrong?
Thanks!
The user control:
public delegate void MemberSelectedEventHandler(object sender, string fullMemberName);
public partial class WebUserControl1 : System.Web.UI.UserControl
{
public event MemberSelectedEventHandler OnMemberSelected;
protected void Button_OnClick(object sender, EventArgs e)
{
if (OnMemberSelected != null)
{
OnMemberSelected(this, "Peter");
}
}
}
This works (code behind of aspx page):
MyMemberControl.OnMemberSelected += new MemberSelectedEventHandler(MyMemberControl_OnMemberSelected);
But this doesn't (aspx page):
<scn:MemberControl OnMemberSelected="MemberControl_OnMemberSelected" runat="server" ID="MyMemberControl" />
In the markup you need to prefix your event property with On so the page will know to register the event. Morzel had the answer though it's not stated explicitly.
<scn:MemberControl OnOnMemberSelected="MemberControl_OnMemberSelected" runat="server" ID="MyMemberControl" />
OnOnMemberSelected should cause your handler to be invoked as expected.
First of all I have to take a bit note: When you make a custom event, you don't need to name it with 'On' prefix. .Net framework adds this prefix and the markup intellisense will show you OnOnMemberSelected.
I don't know if it needs, but try to put the delegate declaration inside your WebUserControl1 class. I always do this.
Markup intellisense reacting really slow and I don't see if it deterministic when popullates intellisense information again.
Sum of all:
- put the delegate definition into your class.
- build
- insert your markup code.
If intellisense doesn't work immediatelly I think it will works.
I am a student who is doing up a simple website in asp.net. My problem is, I wish to integrate Paypal on one of the pages, but asp.net has the ridiculous <form runat="server"> that is getting in my way. I am building a simple site layout using blueprint css, a very basic three-column layout. However, I need my main content section to be able to use the paypal form (buy now button), and the other areas of the site to use user controls, which I presume requires them to be wrapped in that irritating form tag. In fact, I would like to have a sitemap path control at the top of the main section of the site: something very basic. How might I achieve that? My problem is: I can't put the Paypal button in the form, and I don't know how to shift a 4th div into place. I am not even sure how divs and forms stack on each other.
Could I have some help please?
The page with the problem is: http://clubofpep.org/sandbox/sandbox_Alumni.aspx.
Contrary to popular belief, you can have more than one form on ASP.Net webforms pages. What you cannot do is have more than one form with runat="server", nest a second form inside ASP.Net's main form, or use asp.net server controls outside the main form.
Therefore, to integrate a separate paypal form with the rest of an asp.net webforms page, you have to make sure that you can put it either before or after all of the asp.net web controls on the page, and then edit the aspx markup to make sure your paypal form is completely outside of asp.net's form.
The other thing is that a quick web search shows a multitude of paypal controls written for asp.net that will work with the required asp.net form to submit the payment. You could always try one of those.
namespace CustomForm
{
public class GhostForm : System.Web.UI.HtmlControls.HtmlForm
{
protected bool _render;
public bool RenderFormTag
{
get { return _render; }
set { _render = value; }
}
public GhostForm()
{
//By default, show the form tag
_render = true;
}
protected override void RenderBeginTag(HtmlTextWriter writer)
{
//Only render the tag when _render is set to true
if (_render)
base.RenderBeginTag(writer);
}
protected override void RenderEndTag(HtmlTextWriter writer)
{
//Only render the tag when _render is set to true
if (_render)
base.RenderEndTag(writer);
}
}
}
USAGE:
ASPX:
<%# Register TagPrefix="CF" Namespace="CustomForm" Assembly="CustomForm" %>
<body>
<CF:GhostForm id="mainForm" runat="server">
...
</body>
<img src="https://www.sandbox.paypal.com/en_US/i/btn/btn_xpressCheckout.gif"> <asp:Button ID="checkoutBtn" runat="server" OnClick="CheckButton_Click"
Text="Checkout" Width="100" CausesValidation="false" />
Code-Behind:
protected void Page_Load(object sender, EventArgs e)
{
...
// Workaround for PayPal form problem
GhostForm mainForm = new GhostForm();
mainForm.RenderFormTag = false;
// Go ahead and submit to PayPal :)
}
I'm using webforms ASP.NET, with masterpages. I want to add a LANG attribute to the <title> tag. ASP.NET automatically generates a title tag. I've tried adding my own tag with an ID and runat="server", like this:
<title id="titleBlock" runat="server"></title>
When doing this, I can set an attribute like the following without any errors.
titleBlock.Attributes.Add("lang", "it");
However, ASP.NET wipes out my <title> tag completely and puts its own in without my LANG attribute. Is there any way to accomplish this? Thanks very much.
This happens because the HtmlTitle control doesn't provide a RenderAttributes implementation. You can't (easily) subclass the control in this case but there's another option. The power of Control Adapters isn't limited to WebControls - the concept also extends to HtmlControls as well.
Drop the following in a *.browser file under the App_Browsers directory of your site:
<browsers>
<browser refID="Default">
<controlAdapters>
<adapter
controlType="System.Web.UI.HtmlControls.HtmlTitle"
adapterType="HtmlTitleAdapter"
/>
</controlAdapters>
</browser>
</browsers>
Here's a prototype for the corresponding adapter:
using System.Web;
using System.Web.UI;
using System.Web.UI.HtmlControls;
public class HtmlTitleAdapter : System.Web.UI.Adapters.ControlAdapter
{
protected override void Render(System.Web.UI.HtmlTextWriter writer)
{
HtmlTitle title = Control as HtmlTitle;
writer.WriteBeginTag("title");
title.Attributes.Render(writer);
writer.Write(">");
if (title.Text != null)
writer.Write(title.Text);
writer.WriteEndTag("title");
}
}
Note that the internal render implementation of HtmlTitle differs somewhat:
protected internal override void Render(HtmlTextWriter writer)
{
writer.RenderBeginTag(HtmlTextWriterTag.Title);
if (this.HasControls() || base.HasRenderDelegate())
{
this.RenderChildren(writer);
}
else if (this._text != null)
{
writer.Write(this._text);
}
writer.RenderEndTag();
}
I'm not sure when a title would have child elements, so I don't think this an issue.
Hope this helps.
As an aside, it would be much easier to add this attribute on the client using jQuery.
<script type="text/javascript">
$(document).ready(function() {
$("title").attr("lang", "it");
});
</script>
I have a function which sets my linkbutton as the default button for a panel.
protected void Page_PreRender(object sender, EventArgs e)
{
string addClickFunctionScript = #"function addClickFunction(id) {
var b = document.getElementById(id);
if (b && typeof(b.click) == 'undefined')
b.click = function() {
var result = true;
if (b.onclick) result = b.onclick();
if (typeof(result) == 'undefined' || result)
eval(b.getAttribute('href'));
}
};";
string clickScript = String.Format("addClickFunction('{0}');", lbHello.ClientID);
Page.ClientScript.RegisterStartupScript(this.GetType(), "addClickFunctionScript", addClickFunctionScript, true);
Page.ClientScript.RegisterStartupScript(this.GetType(), "click_" + lbHello.ClientID, clickScript, true);
}
This works fine. How to make this reusable to all my pages of my application. One page can have multiple linkbuttons and multiple panels.... Any suggestion...
The cleanest way would be to use a custom server control that inherits from LinkButton. In fact this seems to be in line with the blog post from your earlier question. All you need to do is override the OnPreRender event and paste the code you have while changing lbHello.ClientID to this.ClientID to refer to the specific instance of that control. It should not take more than 10 minutes to set this up. Once this is done, you can use as many of the controls as you want on one page and easily support it throughout your application's various pages.
You might find this MSDN article helpful when following my instructions below, specifically the "Creating the Server Control" section: Walkthrough: Developing and Using a Custom Web Server Control. Here's a step by step guide to accomplishing this:
In your existing solution add a new ASP.NET Server Control project (right click on your solution from the Solution Explorer -> Add New Project -> ASP.NET Server Control). Name it LinkButtonDefault (you're free to change the name, of course).
Rename ServerControl1.cs to LinkButtonDefault.cs
Rename the namespace in the file to CustomControls
Perform steps 12-14 in the MSDN article by opening the AssemblyInfo.cs file (contained in the Properties folder of the project). Add this line at the bottom of the file: [assembly: TagPrefix("CustomControls", "CC")]
In LinkButtonDefault.cs add this code to override the OnPreRender event:
Code (notice the use of this.ClientID):
protected override void OnPreRender(EventArgs e)
{
string addClickFunctionScript = #"function addClickFunction(id) {
var b = document.getElementById(id);
if (b && typeof(b.click) == 'undefined')
b.click = function() {
var result = true;
if (b.onclick) result = b.onclick();
if (typeof(result) == 'undefined' || result)
eval(b.getAttribute('href'));
}
};";
string clickScript = String.Format("addClickFunction('{0}');", this.ClientID);
Page.ClientScript.RegisterStartupScript(this.GetType(), "addClickFunctionScript", addClickFunctionScript, true);
Page.ClientScript.RegisterStartupScript(this.GetType(), "click_" + this.ClientID, clickScript, true);
base.OnPreRender(e);
}
You may also want to update the generated attribute code above the class declaration that starts with [ToolboxData("<{0}: to use LinkButtonDefault instead of ServerControl1. That's it for the new Server Control project. I highly recommend reading the aforementioned MSDN article to take advantage of other capabilities, such as adding controls to the toolbox if you have a need to do so.
After completing these steps you should have a LinkButtonDefault.cs file that resembles this:
using System;
using System.ComponentModel;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace CustomControls
{
[DefaultProperty("Text")]
[ToolboxData("<{0}:LinkButtonDefault runat=server></{0}:LinkButtonDefault>")]
public class LinkButtonDefault : LinkButton
{
[Bindable(true)]
[Category("Appearance")]
[DefaultValue("")]
[Localizable(true)]
public string Text
{
get
{
String s = (String)ViewState["Text"];
return ((s == null) ? "[" + this.ID + "]" : s);
}
set
{
ViewState["Text"] = value;
}
}
protected override void RenderContents(HtmlTextWriter output)
{
output.Write(Text);
}
protected override void OnPreRender(EventArgs e)
{
string addClickFunctionScript = #"function addClickFunction(id) {
var b = document.getElementById(id);
if (b && typeof(b.click) == 'undefined')
b.click = function() {
var result = true;
if (b.onclick) result = b.onclick();
if (typeof(result) == 'undefined' || result)
eval(b.getAttribute('href'));
}
};";
string clickScript = String.Format("addClickFunction('{0}');", this.ClientID);
Page.ClientScript.RegisterStartupScript(this.GetType(), "addClickFunctionScript", addClickFunctionScript, true);
Page.ClientScript.RegisterStartupScript(this.GetType(), "click_" + this.ClientID, clickScript, true);
base.OnPreRender(e);
}
}
}
Now return to your web application and add a reference to the CustomControls project. You should be able to do this from the Add Reference's Project tab since I suggested adding the above project to your existing solution. If you want you could've built the above project in its own solution then you would add a reference to it's .dll file by using the Browse tab. Once a reference has been added you are ready to use the new LinkButtonDefault control.
To use the controls you can use the # Register directive on each page the control will be used, or you can add it to the Web.config and gain easy reference to it throughout your application. I will show you both methods below. Based on your question I think you'll want to add it to the Web.config. Refer to the MSDN article and you will find this information half way down the page under "The Tag Prefix" section.
Using # Register directive:
Go to your desired .aspx page and add the Register directive to the top of each page you want to use the control in:
<%# Register Assembly="CustomControls" Namespace="CustomControls" TagPrefix="CC" %>
On the same page, you may now use multiple instances of the control. Here's an example:
<p><strong>1st Panel:</strong></p>
<asp:Label runat="server" ID="helloLabel" />
<asp:Panel ID="Panel1" runat="server" DefaultButton="lbHello">
First name:
<asp:TextBox runat="server" ID="txtFirstName" />
<CC:LinkButtonDefault ID="lbHello" runat="server" Text="Click me" OnClick="lbHello_Click"
OnClientClick="alert('Hello, World!');" />
</asp:Panel>
<p><strong>2nd Panel:</strong></p>
<asp:Label runat="server" ID="fooBarLabel" />
<asp:Panel ID="Panel2" runat="server" DefaultButton="lbFooBar">
Other:
<asp:TextBox runat="server" ID="TextBox1" />
<CC:LinkButtonDefault ID="lbFooBar" runat="server" Text="Click me" OnClick="lbFooBar_Click" />
</asp:Panel>
In the code behind (.aspx.cs) you would need to add:
protected void Page_Load(object sender, EventArgs e)
{
// example of adding onClick programmatically
lbFooBar.Attributes.Add("onClick", "alert('Foo Bar!');");
}
protected void lbHello_Click(object sender, EventArgs e)
{
helloLabel.Text = String.Format("Hello, {0}", txtFirstName.Text);
}
protected void lbFooBar_Click(object sender, EventArgs e)
{
fooBarLabel.Text = String.Format("FooBar: {0}", TextBox1.Text);
}
Using Web.config:
To use the Web.config keep the exact same markup and code used in the above example. Follow these steps:
Remove the # Register directive used on the .aspx markup.
Open the Web.config file for your web application.
Locate the <system.web>...</system.web> section.
Add the following mapping to that section:
Mapping:
<pages>
<controls>
<add assembly="CustomControls" namespace="CustomControls" tagPrefix="CC" />
</controls>
</pages>
Recompile and everything should build successfully. With this in place you no longer need to specify the # Register directive on each individual page.
If you get stuck and have any questions let me know. Just read over everything above carefully since it's a long post with lots of code.
You could create a class (let's call it Foo) that derives from System.Web.UI.Page and abstract your method to a point where it is reusable. All your ContentPages should derive from Foo instead of System.Web.UI.Page
My recommendation would be to either use a master page, or break the code out into a static function that takes a System.Web.UI.Page object as a parameter. Of course, you could always use inheritance (which will work), but you will lose the ability to layout your page using drag-and-drop design time functionality, since the VS.NET web form designer does a big freakout with ASPX pages that don't derive from System.Web.UI.Page or System.Web.UI.MasterPage directly.
I'd like to use an UpdatePanel in my UserControl. The problem is the .aspx page the control is dropped on will NOT have a ScriptManager. I will need to create the ScriptManager in the UserControl. However if the UserControl is used, say twice on the page, then placing a ScriptManager won't work because you can only initialize ScriptManager once.
In other UserControls where I needed ScriptManager (I was using AJAX Toolkit Extensions) I was able to use this code:
protected override void OnInit(EventArgs e)
{
base.OnInit(e);
Page.Init += new EventHandler(Page_Init);
}
void Page_Init(object sender, EventArgs e)
{
if (Page.Form != null && ScriptManager.GetCurrent(Page) == null)
Page.Form.Controls.AddAt(0, new ScriptManager());
}
..worked great, but not for the UpdatePanel case.
Note, I am NOT using Master Pages
(Another approach I was thinking of, but can't figure out how to do, is to programmatically create the UserControl inside an UpdatePanel.)
I do not think this is possible. I have tried it several different ways. You might have to bite the bullet and put a scriptmanager in your page.
What is the reason it doesn't work? Are you getting an exception from the UpdatePanel that a ScriptManager is required? Are you using System.Web.Extensions 1.0 or 3.5? I say that because a change was made to UpdatePanel in 3.5 that causes its content template to instantiate prior to OnInit, so I don't see an obvious reason why that wouldn't work. If there is an exception it would be helpful to see the stack trace.
I am hitting this same problem. The problem is that you need to add the scriptmanager before the OnInit stage - as far as I can see it needs to be done at the preinit stage. You can see this by adding a load of overrides - I found the the page got through the preinit ok, then went to the addedcontrol event and it was at (or just after, but this point makes sense) that the "You need a scriptmanager" gets thrown. I am struggling to find how to add an event handler to the Page.PreInit event from a child usercontrol as the WUCs don't have a PreInit event. Even the WUC constructor doesn't fire before that point and in the constructor the page object is null so you can't add it there. Even at the AddedControl stage of the WUC, you still don't seem to be able to access the main page ( ScriptManager oSCM = ScriptManager.GetCurrent(Page); returns null) so you can't seem to add the scriptmanager, if you need to, before the error is thrown.
/edit:-
As far as I can see it (and I've had no answer to this on the asp.net forums - surprise, surprise) the WUC doesn't start kicking in it's methods/events until after the parent's preinit stage, so there's 2 ways of doing this.
1) The way I think I would do this is to not put any content in the designer that requires the scriptmanager and to put placeholders where such content needs to go. Then in the wuc load you use the ScriptManager.GetCurrent to see if there's one already there and then create it if not. Then you dynamically add the content that requires the SCM. Something like this:-
<%# Control Language="C#" AutoEventWireup="true" CodeFile="wucTestExample.ascx.cs" Inherits="wucTestExample" %>
<asp:PlaceHolder ID="plcAJAX" runat="server" />
<asp:Label ID="lblGeneral" runat="server" Text="This is another label" />
----------------code behind---------------------------
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class wucTestExample : System.Web.UI.UserControl
{
protected void Page_Load(object sender, EventArgs e)
{
ScriptManager oSCM = ScriptManager.GetCurrent(this.Page);
if (oSCM == null)
{
oSCM = new ScriptManager();
oSCM.ID = "scmAJAX";
oSCM.EnablePartialRendering = true;
this.plcAJAX.Controls.AddAt(0, oSCM);
}
UpdatePanel udpMain = new UpdatePanel();
udpMain.ID = "udpMain";
TextBox txtMain = new TextBox();
txtMain.ID = "txtMain";
// other attrbutes here
Button btnPostback = new Button();
btnPostback.ID = "btnPostback";
btnPostback.Click += new EventHandler(btnPostback_Click);
btnPostback.Text = "Partial Postback";
Label lblPostback = new Label();
lblPostback.ID = "lblPostback";
lblPostback.Text = "initial postback";
udpMain.ContentTemplateContainer.Controls.Add(txtMain);
udpMain.ContentTemplateContainer.Controls.Add(btnPostback);
udpMain.ContentTemplateContainer.Controls.Add(lblPostback);
this.plcAJAX.Controls.Add(udpMain);
}
void btnPostback_Click(object sender, EventArgs e)
{
// implement button code here
Label lblPostback = (Label)this.plcAJAX.FindControl("lblPostback");
if (lblPostback != null)
{
lblPostback.Text = String.Format("WUC POstback at : {0}", DateTime.Now.ToLongTimeString());
}
}
}
then use it thus:-
<%# Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="TestExampleNoSCM.aspx.cs" Inherits="TestExampleNoSCM" %>
<%# Register Src="~/wucTestExample.ascx" TagName="wucTestExample" TagPrefix="ucTE" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<%--<asp:ScriptManager ID="scmAJAX" runat="server" />--%>
<asp:Label ID="lblLoadTime" runat="server" />
<ucTE:wucTestExample ID="wucTestExample" runat="server" />
</asp:Content>
----------------code behind---------------------------
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class TestExampleNoSCM : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
this.lblLoadTime.Text = String.Format("Page load at: {0}",DateTime.Now.ToLongTimeString());
}
}
So if you comment or uncomment the SCM in the parent page, the WUC still works either way.
2) I've seen another option where an update panel was needed and the programmer created all the controls in the designer and then looped round them in the page load (after creating the SCM, if needed, and the UDP and added all the controls on the WUC UDP, before then adding that to to placeholder, but this strikes me as rather dangerous as it seems to be double-instantiating control, and I think it may come back to bite them on the bum...
The downside with method 1 is that it's more work to create everything in your updatepanel programmatically, but if you really want to build a self-dependent WUC, that seems to be your price (and hopefully, the WUC shouldn't be that complicated, anyway). Personally, I think in my app (as the WUC won't be used outside it) I'll just make sure I add in an SCM where needed on the main page.
One other, final, note I would pitch in - I've seen people saying "add it to the master page" - this seems to be a particularly bad idea, IMHO, unless every page in your app needs the SCM as it will add a whole new level of bloat to your pages, and that doesn't seem to be a good idea as ASP.NET seems to have a good level of bloat already...
Instead of dynamically adding a ScriptManager if none exists on the page, simply do the opposite: add a ScriptManager to your ASCX and get rid of it if there's one already on the page. So...
protected override void OnInit(EventArgs e) {
base.OnInit(e);
AdjustScriptManager();
}
private void AdjustScriptManager() {
if (ScriptManager.GetCurrent(Page) != null) {
ScriptManager1 = null;
}
}
UPDATE:
Nah, after further testing this won't work, as ScriptManager1 = null does nothing helpful. If there is a way to do this (or to remove the Page control), please comment.
Solution: you can add a scriptmanager dynamically in the usercontrol by checking if the current page does not already contain a ScriptManager. Here's how:)
In the UserControl (ascx) html put this:
<asp:PlaceHolder ID="pHolder" runat="server" />
And in the code behind (ascx.cs):
//insert Scriptmanager dynamically only IF it does not already exist
private void createScriptManager(System.EventArgs e)
{
// the GetCurrent() method will return a ScriptManager from the Page
if (System.Web.UI.AjaxScriptManager.GetCurrent(this.Page) == null)
{
System.Web.UI.AjaxScriptManager manager = new System.Web.UI.AjaxScriptManager();
manager.EnablePartialRendering = true;
pHolder.Controls.Add(manager);
}
}
// call the above method from the usercontrol's OnInit
override protected void OnInit(EventArgs e)
{
//
// CODEGEN: This call is required by the ASP.NET Web Form Designer.
//
createScriptManager(e);
base.OnInit(e);
}
Sometimes it is necessary to define a ScriptManager dynamically. In my case I am using a usercontrol that will be put into different pages, but some of these pages already contain a ScriptManager and some dont, so how will my usercontrol know if it should define its own ScriptManager? The beauty of the above code is that the usercontrol adds a scriptmanager only if there isn't already one on the page.
Note: the System.Web.UI.AjaxScriptManager may be replaced with System.Web.UI.ScriptManager if you use an older version of Ajax.