Disable ASP.NET 1.1 Validator using JavaScript - Not Working in Firefox

Question

The following attempt works in IE8 but not in Firefox (cannot use JQuery for this):

case 'Template:templateControl:residenceRBL2': 
    if (selected.value == 'Within USA') 
    {
        /* Enable zip textbox and validator */
 document.getElementById("Template_templateControl_zipTxt1").disabled=false;
 ValidatorEnable(document.getElementById('<%=firstPersonZipReqVal.ClientID%>'),
            true);
 ...
    }
    else if (selected.value == 'Outside USA') 
    {
        /* Disable zip textbox and validator */
 document.getElementById("Template_templateControl_zipTxt1").disabled=true;
 ValidatorEnable(document.getElementById('<%=firstPersonZipReqVal.ClientID%>'),
            false);
 ...
    }
    break;

    <asp:Label ID="firstPersonZipLabel" Runat="server"></asp:Label><br />
 <asp:TextBox ID="zipTxt1" Height="19" Width="100" 
        Runat="server"></asp:TextBox>
    <asp:RequiredFieldValidator ID="firstPersonZipReqVal" 
        ControlToValidate="zipTxt1" Display="Dynamic" 
            ErrorMessage="First Person Zip" 
                Runat="server">*</asp:RequiredFieldValidator>

Description of problem: depending on a radiobuttonlist selection, a required validator is disabled/re-enabled for a textbox. Basically, if their address is outside USA, then the zip textbox validator is disabled. In Firefox, this will not work at all.

UPDATE 1: 09-07-2010 I got the textbox disabled in Firefox; I was using the name attribute instead of the id. My only issue now is how to access the "ClientID" of an ASP.NET validator control in JS?

UPDATE 2: 09-07-2010 Per the MSDN documentation, I thought I could do something like this:

ValidatorEnable(firstPersonZipReqVal, false);

Unfortunately this doesn't seem to work in Firefox either...

ASP.NET broken rendering of Validation client side code in Firefox

UPDATE 3: 09-08-2010

The reason Firefox is not playing nice is because ASP.NET 1.1 is treating it as a down-level browser. If I put clientTarget="upLevel" in the Page tag, Firefox works as expected. Unfortunately, this breaks the entire site layout. Is there a more gradual way to fix the browsercaps for Firefox? This version of browserCaps also breaks the layout.

Current browserCaps in Web.Config look like this:

 <browserCaps> 
  <case match="Gecko/[-\d]+">
   browser=Netscape
   frames=true
   tables=true
   cookies=true
   javascript=true
   javaapplets=true
   ecmascriptversion=1.5
   w3cdomversion=1.0
   css1=true
   css2=true
   xml=true
   tagwriter=System.Web.UI.HtmlTextWriter
   <case match="rv:1.0[^\.](?'letters'\w*)">
    version=6.0
    majorversion=6
    minorversion=0
    <case match="^b" with="${letters}">
     beta=true
    </case>
   </case>
   <case match="rv:1(\.\d+)(\.\d)?(?'letters'\w*)">
    version=7.0
    majorversion=7
    minorversion=0
    <case match="^b" with="${letters}">
     beta=true
    </case>
   </case>
  </case>
 </browserCaps>

UPDATE: 09-11-2010

The following link may provide the answer; can someone assist with the code for the 50 points?

https://web.archive.org/web/20211020134119/https://www.4guysfromrolla.com/articles/051204-1.aspx

Aplacental

You're going to have to describe what's going wrong, what the markup looks like, what's supposed to happen when it works, etc. Otherwise it's highly unlikely that anybody's going to be able to figure out your deal. – Getaway

Do you get any errors in Firefox? Can you trace into ValidatorEnable and see what the problem is? It's JS; you should be able to suss it out, especially if it's not delivered minified. – Eclipse

Getting "ValidatorEnable is not defined" in Firebug. – Aplacental

Funny that if Firefox is a down-level browser, then what is IE? – Barkentine

It's treated as a down-level browser by ASP.NET codebetter.com/blogs/jeffrey.palermo/archive/2005/06/29/… – Aplacental

Answer 1

Marked as answer - see link to Scott Mitchell's article on this above.

Aplacental

Answer 2

how to access the "ClientID" of an ASP.NET validator control in JS

You're accessing it the proper way in your code, though you may need to use double quotes instead of single quotes:

document.getElementById("<%=firstPersonZipReqVal.ClientID%>")

Cramp

So, the accessing of the validator doesn't work or the ValidatorEnable call doesn't work? – Cramp

Getting "ValidatorEnable is not defined" in Firebug – Aplacental

Ah, so the question is "how to work with ValidatorEnable" in non-IE browsers then. – Cramp

Yes. Apparently it won't work with Firefox and ASP.NET 1.1, so I have to somehow code around this for non-IE... this didn't work: var validator = document.getElementById("<%=firstPersonZipReqVal.ClientID%>"); validator.enabled = false; – Aplacental

Answer 3

This is too long to add to a comment and is a separate stab at the answer from my above post.

I am straight copy-and-pasting this from a post about this issue, but a user tried something like this:

function disableValidator(elem)
{
    elem.style.cssText = "";
    elem.style.display = 'none';
    elem.style.accelerator = true;
}

disableValidator( document.getElementById("<%=firstPersonZipReqVal.ClientID%>") );

Cramp

document.getElementById("<%=firstPersonZipReqVal.ClientID%>") is coming back as null in Firefox... – Aplacental

Answer 4

I believe that the problem here is that you call the Javascript before the DOM is ready, so thats why can not find your elements with the getElementByID.

There are 2 solutions.

1. Render your JavaScript on the bottom of the page, at least after your controls.
2. Place your Javascript call on a function and first call it with window.onload.

And for sure you need to call them with the palswim suggestion using <%=firstPersonZipReqVal.ClientID%>

I am not 100% that this is the issue because I do not see the full code, but this is the main reason when the getElementByID is not find an existing control.

Presidentelect

Even though IE8 can display it with an alert using getElementByID? – Aplacental

@Aplacental As I say I am not sure because I do not see the full code. Some time synchronization and small delay can do that. Before you make call and ask for element id you need to be sure that have been render. – Presidentelect

Answer 5

well, question is very old, but fr1.1 still alive - actually Mitchell's article does not provide workaround, let me show mine:
1. Web config browserCaps should contain "msdomversion", something be like this:

        <browserCaps>
        <case match="^Mozilla/5\.0 \([^)]*\) (Gecko/[-\d]+)(?'VendorProductToken' (?'type'[^/\d]*)([\d]*)/(?'version'(?'major'\d+)(?'minor'\.\d+)(?'letters'\w*)))?">
            browser=Gecko
            <filter>
                <case match="(Gecko/[-\d]+)(?'VendorProductToken' (?'type'[^/\d]*)([\d]*)/(?'version'(?'major'\d+)(?'minor'\.\d+)(?'letters'\w*)))">
                type=${type}
                </case>
                <case>
                    <!-- plain Mozilla if no VendorProductToken found -->
                type=Mozilla
                </case>
            </filter>
            frames=true
            tables=true
            cookies=true
            javascript=true
            javaapplets=true
            ecmascriptversion=1.2 
            w3cdomversion=1.0
            css1=true
            css2=true
            xml=true
            msdomversion=6.0
            tagwriter=System.Web.UI.HtmlTextWriter
            <case match="rv:(?'version'(?'major'\d+)(?'minor'\.\d+)(?'letters'\w*))">
                version=${version}
                majorversion=0${major}
                minorversion=0${minor}
                <case match="^b" with="${letters}">
                    beta=true
                </case>
            </case>
        </case>
        <case match="Chrome/(?'version'(?'major'\d+)\.(?'minor'\d+\.\d+).\d+)">
            browser=Chrome
            version=${version}
            majorversion=${major}
            minorversion=${minor}
            frames=true
            tables=true
            cookies=true
            javascript=true
            javaapplets=true
            ecmascriptversion=1.5
            w3cdomversion=1.0
            msdomversion=6.0
            css1=true
            css2=true
            xml=true
            tagwriter=System.Web.UI.HtmlTextWriter
        </case>
    </browserCaps>

2. WebUIValidation.js should be modified:
2.1 replace calls to document.all by document.getElementById (Mitchell)
2.2 rename variable "final" (Mitchell)
2.3 add function to read expando as attributes:

function ValidatorValidatorGetAttribute(item, attribName)
{
    var retVal = null;
    var attribs = item.attributes;
    for (var i = attribs.length - 1; i >= 0; i--)
    {
        var attrib = attribs[i];
        if (attrib.nodeName == attribName)
        {
            retVal = attrib.nodeValue;
        }
    }
    return retVal;
}

2.4 add expando handling logic, for example in ValidatorOnLoad:

if (typeof(val.evaluationfunction) == "string") {
    eval("val.evaluationfunction = " + val.evaluationfunction + ";");
}
else
if (typeof(ValidatorGetAttribute(val,'evaluationfunction')) == "string") {
    eval("val.evaluationfunction = " + ValidatorGetAttribute(val,'evaluationfunction') + ";");
}

3. Add client side script on the page (automatic script checks if it runs on IE browser only)

var nonIEBrowser = false;
if (typeof(clientInformation) == "undefined")
    nonIEBrowser = true;
if ((typeof(clientInformation) != "undefined") && (clientInformation.appName.indexOf("Explorer") == -1))
    nonIEBrowser = true;
//None - IE browsers, and possibly IE 10+ 
if (nonIEBrowser) 
{
    if (typeof(Page_ValidationVer) == "undefined")
        alert("Unable to find script library '/aspnet_client/system_web/1_1_4322/WebUIValidation.js'. Try placing this file manually, or reinstall by running 'aspnet_regiis -c'.");
    else if (Page_ValidationVer != "125")
        alert("This page uses an incorrect version of WebUIValidation.js. The page expects version 125. The script library is " + Page_ValidationVer + ".");
    else
        ValidatorOnLoad();
}

that's all. At least it works for me :)

Referential