Question

I have jQuery in various files, and recently I have needed to change items in the master page. This has caused various jaavscript includes to stop working. Stackoverflow are suggesting great ideas to solve the issue regarding the get by ID selector.

$("#ctl00_ContentMainPane_eliteUser").html

However I have a problem where we have used jquery.validate.js to validate form controls, so there is code like this in external JS files

$(document).ready(function(){ 
    $("#aspnetForm").validate({
        rules: 
    {
        ctl00$ContentMainPane$txtFirstName:
        {
            required:true,
            CheckAlfaNumeric:true
        },
        ctl00$ContentMainPane$ctl00$ucRFI$txtComments:
        {
            required:true
        }                       

    },
    messages:
    {
        ctl00$ContentMainPane$txtFirstName: 
        {
            required:" Please enter first name"
        },
        ctl00$ContentMainPane$ctl00$ucRFI$txtComments:
        {
            required:" Please enter comments."
        }
    }
    });
    $("#" + GetPlaceholder() + "txtFirstName").blur(function(){
            $("#" + GetPlaceholder() + "txtFirstName").valid();
    });
    jQuery.validator.addMethod("CheckAlfaNumeric", function(value, element) {
            return this.optional(element) || /^[A-Za-z\ ]+$/i.test(value);
    }, " Please enter alphabet.");
});

Any idea how to prevent the nameing issue of attributes if the name happens to change due to the master page being amended?

Answer 1

Wait for .NET 4.0, which allows you to specify exactly how the ID’s should be constructed 😉

Seriously: you can AFAIK create your rules manually, doing something like (a JS object is nothing but an “array” of properties):

var myRules = new Object();
myRules[GetPlaceholder() + "txtFirstName"] = { required:true, CheckAlfaNumeric:true };

var myMessages = new Object();
myMessages[GetPlaceholder() + "txtFirstName"] = { required:"Please enter first name" };

$("#aspnetForm").validate({ rules: myRules, messages: myMessages });