Validator in <noscript> causes JavaScript error - asp.net

The following .NET 3.5 code, placed in an aspx file, will trigger a JavaScript error when the page is loaded (for users who have JavaScript enabled):
<noscript>
<asp:TextBox ID="txt" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator ID="txt_RequiredFieldValidator" runat="server"
ControlToValidate="txt"></asp:RequiredFieldValidator>
<asp:Button ID="btn" runat="server" Text="Button" />
</noscript>
The error happens because the JavaScript generated by the ASP.NET validator control does not contain a null check on before the second code line below:
var ctl00_body_txt_RequiredFieldValidator =
document.all ?
document.all["ctl00_body_txt_RequiredFieldValidator"] :
document.getElementById("ctl00_body_txt_RequiredFieldValidator");
ctl00_body_txt_RequiredFieldValidator.controltovalidate = "ctl00_body_txt";
Can anyone suggest a workaround to this?
Footnote: Why am I doing this? For my non-JavaScript users I am replacing some AJAX functionality with some different UI components, which need validation.

You should add the following to the RequiredFieldValidator:
enableclientscript="false"
Seeing as you are using these in <noscript> tags, there is no point in supplying client side vaildation of the controls - they are only going to display if JS is turned off.
This will force the validation to happen (automatically) on the server side for you.
Just make sure you call "Page.IsValid" before you process the response.
See BaseValidator.EnableClientScript for more details.

The javascript is looking for an element contained in the noscript? AFAIK there's no clean way to detect script support from the server side.
I think you'll need to build in a redirect (I've seen this done with a meta-refresh in a header noscript if you don't mind a validation failure) to push noscript users to a "please turnscript on page" or do some surgery to loosen up the validation/control binding which may take some amount of wheel reinventing. This is one of those areas where asp.net's tight coupling between controller and view really punishes.

Related

When working in Visual Studio, can the ' asp: ' portion of an element be omitted?

Situation: I have been creating webpages in HTML5/CSS3 & Javascript using Sublime 2 text editor for a year, however a college course now requires me to use Asp.Net and Visual Studio 2010. I do not use the designer because I am proficient at doing things by hand, however I find that writing asp: inside every element is time consuming and causes syntax errors when applied to some HTML 5 tags and not others.
Example HTML 5: <button id="btn" type="submit" value="Button"/>
Example Asp.net: <asp:Button ID="Button1" runat="server" Text="Button" />
Question: Can the asp: portion be omitted without effecting anything or is it required for IIS or the C# back-end functionality? What about runat="server" can that be omitted?
Google has come up dry regarding my inquiry, so any help is appreciated.
you simply cannot remove either of the two
but hear me out why, because I have a feeling you are not familiar with ASP and therefor are mistaking the meaning of the asp: and the runat="server" syntax.
first: runat="server"
this property on an element, tells the the compiler that this is actually a server side control
so a <button/> is not the same as an <button runat="server"/>
the first one is pure html, while the second one is a control, which can be bound to on the server side. .Net will give it a clientID (not to be mistaken by the ID you have to give it yourself).
second: asp:
this is a prefix, on certain elements, that tells the compiler these are ASP controls (the default controls given by the ASP.net framework). These include Buttons, TextBoxes, DropDownLists, ...
do not mistake 1 of these with a html element.
an <asp:Button id="myAspButton" runat="server"/>
is not the same as a <button id="myHtmlButton"/>
the first, is a server side control, which can be bound to (see it's runat="server" attribute), and this control renders to the browser as a <input type="submit"/> for example.
you could alter the rendering of the asp.net button class to make it return something entirely differnt if you wish.
and you are also not limited to using asp.net classes.
you can create your own controls, and put them in a custom created library
you could give those your own prefix.
if I created such a custom control, I could register a prefix for it in the web.config file,
and thus I could create a custom button extending from the original one (but with a default label in front...
<myc:CustomButton ID="myButton" Text="myButton" Label="myLabel" runat="server"/>
which could render into:
<label>myLabel</label>
<button ID="*******">myButton</button>
the asterisks are symbolizing the Unique ID it will get from the .net framework
if you want to know more on custom controls, or extending default controls
here is a step by step explanation to create custom controls, or extend from a TextBox control.
it also shows how you add a custom prefix for your controls (in the this case 'cc')
you can find more info here
The runat="server" part is required to tell .NET that it will have to render a button there (which will contain .NET specific ID for processing upon POST). Not too familiar with web forms (I started with MVC), but I would assume that the asp: part is to help distinguish between server controls and standard HTML markup.
Why not try removing it and if it breaks something, then you know it's needed. For instance if the button doesn't show up after removing it, then obviously the .NET markup parser needs it to be there in order to know that it is a place holder for a server control.

Is this asp compiled somehow?

I have an aspx document (I know nothing about asp, .net, aspx, nada). It is a normal html table structure for the most part, but there are strings of asp that seem to be inserting some sort of dynamic content. They are in the form:
<asp:Image ID="imgTopImage" runat="server" ImageUrl="~/Images/topbar.jpg" />
<asp:Label ID="lblStyleCaption" runat="server" CssClass="label_caption" Text="Theme: " Visible="false" />
<asp:DropDownList ID="dropStyles" Width="150" runat="server" AutoPostBack="true" />
It seems that whenever I delete one of these——something as innocuous as, say, the line with the asp:Image tag, which I would think should just remove the image, when I load the page I get run-time errors. It's very particular. My question is, is this compiled somehow, which is making it so fragile. Even just changing the topbar.jpg to something.png gives me an error. Do I need to track down the original files this was compiled from, or is this normal server-side asp(x?) that I'm just somehow else goofing up my changes to?
ASPX pages are compiled, and those tags refer to objects that are known to the server, so removing them could cause errors.
First, some basics in layman's terms
Tags that begin with ASP: (Example, <ASP:Button id="btnSubmit" runat="Server" Text="Click Me" />)
are not standard html buttons. They are server controls. When generating the html that goes out to the browser, the ASP.NET runtime looks at the server controls and creates the appropriate content depending on the browser visiting the page.
In the case of the Button control, it's usually a standard html button, but the runtime also generates the JavaScript and such to handle the button's server-side click event.
Why you're probably seeing errors when you remove a control:
Quite often, there's server-side code that's written that accesses these controls. For example, the developer may have decided to change the Text or the Visible property due to some event.
If this is the case, and you remove the <asp:Button> tag, then there will be server-side code that references an object that no longer exists in the aspx page, hence the errors.
More at these links on Server Controls:
http://www.w3schools.com/aspnet/aspnet_controls.asp
(Actually, this older one is better for a new-to-asp.net developer: http://msdn.microsoft.com/en-us/library/zsyt68f1(VS.71).aspx
http://support.microsoft.com/kb/306459
I'd also recommend taking some time watching basic videos or going through the tutorials at http://www.asp.net/get-started
I just noticed this in your question:
Even just changing the topbar.jpg to something.png gives me an error.
That is a bit odd, but I know of at least one way it could happen...
Generally, Visual Studio will give you a warning (and not an error) if you include a relative URL to an image or a linked page that doesn't exist. The warning shouldn't block you from compiling. However, Visual Studio does have a setting that tells it to treat warnings as errors. That will block it from compiling. Here's how that would be set up:
from Project Settings> Configuration Properties select the build
setting and change the “treat warnings as errors” settings to true.
If you wish to NOT treat warnings as errors, simply change the setting to false.

Button not processing onClick method

I have a button on an ascx control that calls a method on the onClick event:
<asp:Button id="bUpdateText" onClick="FUpdate" ValidationGroup="Update" CausesValidation="False" Text="Update" cssclass="button" runat="server" />
Normally I use this control on it's own page and the button works. This time round however, I am loading this control into a Div that is present on the home page of my site (that way I can show the contents with a little bit of JQuery). However, when I bring the control in this way, the onClick event doesn't fire and I am not sure what could cause that.
Sorry I don't have any code sample but the nature of the site makes it difficult to provide any that would make sense.
In short, what would stop this event firing now?
p.s I have tried adding validation groups to all other buttons and validation controls on the page and there is only ONE form present on the page.
EDIT: I have only just added the validation stuff in to see if that does anything. By default it has been like this and still didn't work:
<asp:Button id="bUpdateText" onClick="FUpdate" Text="Update" cssclass="button" runat="server" />
As mentioned as well, this works when I use this control on it's own page (loaded directly into Default.aspx) so I don't think the case of onClick matters.
EDIT2: I have just noticed that when I click this button, other validation controls on my page are being triggered even though they have their own DIFFERENT validation group?! Taking these controls out doesn't help though.
Thanks.
I have found out what is causing the issue.
This control that I am now including is called on the Page_Finalize() and I am guessing that by this point the viewstate has forgotten it needs to do anything. Loading this control on the page load sorts it out.
Thanks for looking.
To start, if you set the 'causesValidation' property to false, you do not need a validation group.
Additionally, I believe that ASP cares about case when dealing with the OnClick command.
i.e. it should be OnClick not onClick
Yeah, annoying and small, but that might be your problem
You can use Firebug to see what happen in Update validationGroup. it looks like your page execute only client-side button click because of Update validationGroup.

How to fill a Label.Text - Property via jQuery

I use ASP.NET and have a label control on my page, which I fill with
the jQuery-Command
$('#<%= myLabel.ClientID %>').html(content);
.val() does not seem to work with this.
Somehow, I have Problems getting the content in code-behind. In the code, the myLabel.Text-Property is still empty.
If you want to display the value on the client and have it available on the page, you need an input that'll get sent to the code-behind when you POST like this:
$('#<%= myLabel.ClientID %>').html(content);
$('#<%= myInput.ClientID %>').val(content);
<asp:Label Id="myLabel" runat="server" />
<asp:HiddenField ID="myInput" runat="server" />
In the code-behind:
myInput.Value
I think your problem is that labels (rendered as span tags) are inherently read-only in the asp.net world. They're not meant to be used as 'input' controls, and as such changes to their HTML on the client-side are ignored on the server-side, where values are set based on ViewState.
To do what you are asking, you'd have to notify the server of the change as well, such as by using AJAX. The only issue here is ajax webmethods in your code behind are static, and because of this can't access the page's control set to change the .Text value.
In the end the easiest option is to make use of hidden fields as Nick said. These are technically 'input' controls and their values changed on the client-side are sent to the server as you desire. You'd just have to keep the label/span and hidden field/input synchronized on the client.
Hope this helps.

When to use HtmlControls vs WebControls

I like HtmlControls because there is no HTML magic going on... the asp source looks similar to what the client sees.
I can't argue with the utility of GridView, Repeater, CheckBoxLists, etc, so I use them when I need that functionality.
Also, it looks weird to have code that mixes and matches:
<asp:Button id='btnOK' runat='server' Text='OK' />
<input id='btnCancel' runat='server' type='button' value='Cancel' />
(The above case in the event you wanted to bind a server-side event listener to OK but Cancel just runs a javascript that hides the current div)
Is there some definitive style guide out there? Should HtmlControls just be avoided?
It might be useful to think of HTML controls as an option when you want more control over the mark up that ends up getting emitted by your page. More control in the sense that you want EVERY browser to see exactly the same markup.
If you create System.Web.UI.HtmlControls like:
<input id='btnCancel' runat='server' type='button' value='Cancel' />
Then you know what kind of code is going to be emitted. Even though most of the time:
<asp:Button id='btnCancel' runat='server' Text='Cancel' />
will end up being the same markup. The same markup is not always emitted for all WebControls. Many WebControls have built in adaptive rendering that will render different HTML based on the browser user agent. As an example a DataGrid will look quite different in a mobile browser than it will in a desktop browser.
Using WebControls as opposed to HtmlControls also lets you take advantage of ASP.NET v2.0 ControlAdapters which I believe only works with WebControls, this will allow you programatic config driven control over the markup that gets emitted.
This might seem more valuable when you consider that certain mobile browsers or WebTVs are going to want WML or completely different sets of markups.
In my experience, there's very little difference. As Darren said, if you don't need server-side functionality, HTML controls are probably lower-impact.
And don't forget, you can bolt server-side functionality onto almost any HTML control just by adding a runat="server" directive and an ID to it.
well... i wouldn't use an html control if you don't need to do anything on it on the server. i would do
<input id='btnCancel' type='button' value='Cancel' />
fin.
By adding runat="server" you can get access to any HTML controls in server side..
and I believe HTML controls are less weight compared to ASP.NET server controls..

Resources