JQuery Validation Plugin: How do I get it to revalidate.

Question

The site: http://tinyurl.com/358lh6a

I want to revalidate the palace address (domain they are wanting, form is: Name) whenever the DomainSelect (the domain extention) is changed in anyway.

I tried just a simple:

<select id=DomainSelect name=DomainSelect onChange="$('#Register').validate().element('#Name');">

It didn't work though. I am not sure if the .element actually revalidates the form element, or just returns true or false.

Also, it should be noted that when the Package changes, the DomainSelect is completely erased and inputed with new values (which might mess up something). If another way could be suggest such as some sort of hiding.

Edit:

Looking at the source for the plugin, I look at the remote function:

remote: function(value, element, param) {
            if ( this.optional(element) )
                return "dependency-mismatch";

            var previous = this.previousValue(element);
            if (!this.settings.messages[element.name] )
                this.settings.messages[element.name] = {};
            previous.originalMessage = this.settings.messages[element.name].remote;
            this.settings.messages[element.name].remote = previous.message;

            param = typeof param == "string" && {url:param} || param; 

            if ( previous.old !== value ) {

The important part here is the previous.old !== value. Since I am really only validating #Name, and tossing along #DomainSelect in a HTTP POST...the #Name value never changes, so the function doest trigger.'

One way I could get around this is make a hidden input that concatenates #Name & #DomainSelect together and then validate that, that way the value changes. Unless someone else comes up with a better idea. Another option would doing my own method, but this I have write needless code for a Http request and etc.

Edit: I decided to try making a hidden input that takes the values of the two inputs and then validates it. The code was messy:

<input name=Name id=Name size=17 onKeyUp="$('#NameDomainSelect').val(   $('#Name').val() + $('#DomainSelect').val()     );$('#NameDomainSelect').valid();">
<select id=DomainSelect name=DomainSelect onChange="$('#NameDomainSelect').val( $('#Name').val() + $('#DomainSelect').val()     );$('#NameDomainSelect').valid();">

Where Name was the subdomain and DomainSelect was the domain itself. Then NameDomainSelect was both Name and DomainSelect concatenated. I then had to define a rule for NameDomainSelect and modify my PHP a bit. However, now it shows 2 check marks because its validating both Name (for required) and NameDomainSelect... Sigh...

So I've decided as a workaround until someone shows me otherwise to modify the validate's remote function to accept an array as a param. The 0 element being a string pointing to which form value to include, in this case DomainSelect...and the 1 element the object as normal for the ajax request.

if (!param[0] == "") value = value + $("#" + param[0]).val();
...
param = typeof param[1] == "string" && {url:param[1]} || param[1]; 

For remote calls where I won't need 2 values to depend on, I simply just set the 0 element to "".

Answer 1

Try:

<select id="DomainSelect" name="DomainSelect" onChange="$('#Name').valid();">

if not working i will recommend to add another custom method as you said before...