Got more questions? Find advice on: SQL | XML | Regular Expressions | Windows
in Search
Welcome to AspAdvice Sign in | Join | Help

C# Nuggets

Client-side validation in Firefox

Recently, I was faced with a problem whereby client-side validation of controls failed to work in Firefox. Only server-side validation was working. Client side validation was working fine in IE.

This was puzzling as everything I read said that ASP.Net v2 supported client-side validation in Firefox. No amount of Googling helped to identify the problem, so I had to track it down from scratch - and the results were quite interesting. If you have

<xhtmlConformance mode="Legacy"/>

set in your web.config, then client-side validation is disabled in firefox.

To see why, we have to jump down into the validation framework that ASP.Net sends to the web browser. The actual Javascript validation function looks like:

function ValidatorValidate(val) {

      val.isvalid = true;

      if (val.enabled != false) {

            if (typeof(val.evaluationfunction) == "function") {

                  val.isvalid = val.evaluationfunction(val);

            }

      }

      ValidatorUpdateDisplay(val);

}

Using Venkman, I was able to see that val.evaluationfunction wasn't a function at all, therefore the page wasn't getting validated because of this. A bit more searching found that this evaluationfunction is an expando attribute. In ASP.Net v1, this expando is an IE-only HTML expando, defined directly in the HTML markup. In ASP.Net v2, this is a Javascript expando attribute, defined on the DOM via Javascript, and therefore compatible with both IE and Firefox.

For example, the RequiredFieldValidator calls RegisterExpandoAttribute. You can call this method yourself like:

Page.ClientScript.RegisterExpandoAttribute(TextBox1.ClientID, "value", TextBox1.Text);

 This produces a block of Javascript just before the closing </form> tag like:

<script type="text/javascript">

<!--

var TextBox1 = document.all ? document.all["TextBox1"] : document.getElementById("TextBox1");

TextBox1.value = "";

// -->

</script>

where "value" has become the new expando attribute. In the case of the RequiredFieldValidator, the expando name is" evaluationfunction" and it is added to the <span> representing the control at runtime.

It turned out that this block of Javascript wasn't being sent to Firefox in my situation, and I didn't know why. Instead, the evaluationfunction expando attribute was being rendered directly on the <span> element in HTML.

So after good deal of decompilation using Reflector, and debugging using Reflection Invokeing of private methods, I discovered the problem was that RegisterExpandoAttribute checks the XHTML Rendering Mode prior to generating the Javascript and if that rendering mode is set to Legacy, then the expando is rendered directly onto the <span> element and no Javascript code is rendered. The result of this is to prevent Firefox from performing client-side validation when Legacy XHTML mode is set.

I have no idea why the ASP.Net team chose to do this for validation. Perhaps the Legacy XHTML setting should have been called "ASPNetv1Conformance" because that's actually what it does. The docs for Legacy mode state:

"Reverts a number of rendering changes made for conformance to the v1.1 rendering behavior."

 

Published Wednesday, November 01, 2006 8:49 AM by rbirkby

Comment Notification

If you would like to receive an email when updates are made to this post, please register here

Subscribe to this post's comments using RSS

Comments

 

TIAN said:

Good work! That's exactly what i want to know. Thanks you for help me to identify this problem.
December 20, 2006 10:39 PM
 

Pete said:

I just spent the last 3 hours trying to figure this one out. Thank you for posting this solution. I commented out the indicated line and Firefox now works as advertised with ASP.NET 2.0! I was working on a site that was upgraded from 1.1 to 2.0 so I wonder if that was why it got defaulted to legacy?..
February 1, 2007 12:38 AM
 

MediocreFred said:

Muchos gracias! I spent two whole days (and most of both nights) trying to get my validators to work with Firefox - and mine is a medium sized asp.net app that was written in VS2003 and migrated to VS2005. I looked high and low and Google sent me on numerous wild goose chases. However, your solution is the only one that really worked - and explained WHY. Thanks again.
March 7, 2007 3:38 PM
 

Chris Mangiapane said:

Like those above, thank you so much. I have been Googling this problem for quite some time now! Thanks.
March 13, 2007 4:40 PM
 

Kasamsun said:

Great job. Thanks for your posting. very useful for me.
March 26, 2007 4:03 AM
 

Peoplez76 said:

Thank you so much! A few days wasted, but at least the answer was found!
April 18, 2007 3:02 PM
 

Paulo said:

Thanks!! I've spent lot of time trying to figure it out. When I tested it on a new small application, it worked fine, but not on an huge application migrated from VS2003 which had this setting at the web.config. Thanks again!
April 26, 2007 12:05 PM
 

Tony said:

Thanks, it save my time and very userful.
June 18, 2007 2:24 PM
 

CG said:

Thanks much for this explanation. Googling found very little (as of Aug30/07). I found something on another site that started me down the path of installing FireBug and drilling to ValidatorValidate() where I could see the problem but no obvious solution. It would have taken me much longer to figure it all out- Googling again with ValidatorValidate firefox found your page. Yee Ha!
August 30, 2007 9:49 PM
 

Bruce said:

I can't thank you enough!!! This has been driving me crazy and wasted about 2 days. Finally found this link and problem solved!
September 17, 2007 2:13 PM
 

enabled said:

Weird. I wonder why val.enabled always equals false in ValidatorValidate() I set it equal to true in the C# code. Grrrrr
September 20, 2007 12:21 PM
 

bincy said:

hi, im using asp.net 1.1...............and the same problem of client side validation not working in firefox.Please suggest a solution for this?
October 9, 2007 6:57 AM
 

rbirkby said:

Client-side validation does not work in ASP.Net 1.0 or 1.1 - it was a new feature in ASP.Net v2.

October 9, 2007 7:44 AM
 

Ji said:

I'm using Firefox 2.0.0.3 with ASP 2.0 and I changed the xhtmlConformance mode to Transitional and I still cant get the validators to work correctly. When I debug, in the ValidatorValidate, it wont recognize (val.evaluationfunction). Is there something I missed? 203 function ValidatorValidate(val, validationGroup, event) { 204 val.isvalid = true; 205 if ((typeof(val.enabled) == "undefined" || val.enabled != false) && IsValidationGroupMatch(val, validationGroup)) { 206 if (typeof(val.evaluationfunction) == "function") { 207 val.isvalid = val.evaluationfunction(val); 208 if (!val.isvalid && Page_InvalidControlToBeFocused == null && 209 typeof(val.focusOnError) == "string" && val.focusOnError == "t") { 210 ValidatorSetFocus(val, event); 211 }
October 29, 2007 7:00 PM
 

Rainer said:

Thank you so much for your investigation on this issue!! This was exactly the answer i could not find.
June 16, 2008 6:31 PM
 

Ramon said:

I think the reason why microsoft team still keep "Legacy" is to support loose XHTML. An example of non-standard version javascript which is equivalent to getElementById("someId") is $("someId") If you remove , it can't support $ anymore.
July 8, 2008 7:37 PM
 

rbirkby said:

Hi Ramon,

$() is a JavaScript function implemented by most AJAX libraries. It has nothing to do with XHTML.

And in most AJAX libraries, $() does a lot more than a simple getElementById() - for example, in prototype.js it accepts multiple arguments the type of which can either be DOMElement or string and attempts to resolve the string ID into a DOMElement if necessary returning an array of results.

July 9, 2008 3:45 AM
 

Ryan said:

Great fix, Same as the rest of the people, thanks for sharing...
January 14, 2009 12:04 AM
 

Martin Carreras said:

Hi, I'm from Argentina. Finally reading this post I realized I had to change in my web.config the "xhtmlConformance" value in order to have client-side Validation on Firefox. My actual Problem: Using xhtmlConformance in "Transitional" makes an ImageButton to fail. I also tried in "Strict" mode, just the same result as Transitional; and I also tried commenting all, same result. The question would be: Why does my ImageButton only work under "Legacy" mode? Does anybody have an idea what could be happening ?? Thanks from Buenos Aires !!
April 15, 2009 9:12 PM
 

Preyas said:

Great Job. Thanks for the detailed analysis.
May 7, 2009 2:14 AM
 

LilScrappy94 said:

Yeahh!!! Thanks a lot! With your Remove the *** I fixed my asp form validation in firefox AND my controls in update panels that done f***ing postback. Thanks to you I can go to Tunisia for holidays!!!! My boss asked me to do his f***ing *** before thursday...
June 3, 2009 11:28 AM
 

Jamal Hasan said:

Thanks a lot!!! you saved A LOT of time for us. Good work!!!
July 24, 2009 2:39 PM
 

Ramesh Singh said:

Thanks guys! I appreciate for your research work. you have saved my alot of times
August 12, 2009 9:35 AM
 

Laura said:

Thank you sooo much! This is much easier than the convoluted work-arounds I was considering!
September 7, 2009 11:15 AM
 

Bijay said:

Thnx dude, this article helped me a lot..
January 27, 2010 7:38 AM
 

S said:

Thanks. Great information
March 31, 2010 7:45 AM
 

Around and About .NET World said:

Problemi con validazione lato client su Firefox

October 13, 2010 7:32 AM
 

Around and About .NET World said:

Questa mattina, testando un sito realizzato in ASP .NET 2.0, ho notato che la validazione lato client

October 13, 2010 7:33 AM
 

Luiz said:

<xhtmlConformance mode="Legacy"/>

TO

<xhtmlConformance mode="Transitional"/>

February 8, 2011 1:59 PM
 

govind said:

thanks a lot. it helped me a lot
March 14, 2011 10:46 AM
 

Naveen said:

Thanks it saved my time!
December 6, 2011 11:27 AM
 

Jon said:

A gift that keeps giving, thanks for blazing the trail, um-er-uhhh, 6 years ago :-). This also was fixed a null reference I ran into in MS generated ValidatorOnChange function, which was caused by Validators collection being undefined when run in non-IE browser.
February 27, 2012 5:28 PM
 

rbirkby said:

@Jon - :-) Thanks for that

February 27, 2012 6:51 PM
 

Gangs said:

Thanks a lot.But even if I removed that statement, only "Required field" validator is working,but custom validator not working in firefox.Pls provide solution if you know.Thanks in advance.
June 29, 2012 4:57 AM

Leave a Comment

(required) 
(optional)
(required) 
Enter the code you see below

Submit