ContactForm (Ch. 9) - Validation

Tulsi · November 10th, 2014, 02:13 PM

Hi Imar,

I am trying to move some of the javascript from the ContactForm user control to an external .js file. I'm a little stuck as to how to handle the client-side validation for the customValidator (p.312), ValidatePhoneNumbers:

Code:

function ValidatePhoneNumbers(source, args) 
{
    var phoneHome = document.getElementById('<%= PhoneHome.ClientID %>');
    var phoneBusiness = document.getElementById('<%= PhoneBusiness.ClientID %>');

    if (phoneHome.value != '' || phoneBusiness.value != '')
    {
        args.IsValid = true;
    }
    else
    {
        args.IsValid = false;
    }
}

This validation works perfect if left in the .acx file, but doesn't work if I move it to an external .js file.

In general, it seems that "<% %> " blocks are only allowed inside .aspx files. So I get an "Unable to get property value of an undefined or null reference" error on line, if (phoneHome.value != '' || phoneBusiness.value != '').

What is the best way to handle code with "<% %>" and move it to external .js files?

I guess one solution might be to change the ClientIDMode property for controls to static and then reference the control by id when using document.getElementById(''), but is this the recommended way?

Thanks.
Tulsi

Imar · November 10th, 2014, 03:43 PM

Hi Tulsi,

>> I guess one solution might be to change the ClientIDMode property for controls to static and then reference the control by id when using document.getElementById(''), but is this the recommended way?'

Yes, that's the way to do it. Alternatively you can assign a CSS class and inside your JS file get the control by its CSS classs. It's the same thing eventually, so I think the ID route is a bit more explicit.

Cheers,

Imar