jquery.validation - how to ignore default values when validating mandatory fields

Question

I am using jquery validation plugin to validate a registration form.

Each text input field has instructions pre-filled as values in the input box

ex: for a

Answer 1

I think you need to add the "default" case to get this working properly:

jQuery.validator.addMethod("defaultInvalid", function(value, element) {
        switch (element.value) {
          case "$defaultText":
              if (element.name == "$defaultText")
                  return false;
              break;
          default:
            return true;
            break;
        }
});

Answer 2

I figured a way around the problem by creating a custom validation using validator.addMethod, which is really easy.

I have pasted a snippet of my validation block below:

   //1. Define custom validation 
    $(document).ready(function() 
    {
    jQuery.validator.addMethod("defaultInvalid", function(value, element) 
    {
     switch (element.value) 
     {
      case "Your Name": -- this will be the default value in the Name text box
       if (element.name == "Your Name")
          return false;
     }
    }
    //2. Include custom validation in the rules for your element
    $("#aspnetForm").validate(
    {
      rules: 
      {
       Name: "required defaultInvalid"
      },
      messages: 
      {
       Name: "Please input your name"
      }
    })
   }

I have used the same for all the elements which have default values in the form. This works great.

Answer 3

$.validator.addMethod("defaultInvalid", function(value, element, param){
        var r = $(element).rules();
        var req=(this.objectLength(r))?r.required:false; // OR may be var req=r.required; // true, false or undefined.
        return !req || (value!=param);
    },$.validator.messages.required);

...

,rules:{
            message: {
                defaultInvalid:$('#message').attr('placeholder')
            }
        }

Such function takes into consideration cases of "mandatory" & "optional" fields.

Expression "!req" purposely replaces "this.optional(element)" because I get error message "dependency mismatch" in some cases.

Answer 4

If you want to add a custom error message to it jus tuse this.

jQuery.validator.addMethod("defaultInvalid", function(value, element) {
    return !(element.value == element.defaultValue);
}, 'Custom Error Message for this field');

Answer 5

just add this after rule section

onfocusout: function(element) { $(element).valid(); }

and it will be all right.

Answer 6

I made some patch to jquery.validationEngine to allow ignoring some input field for some complexe form. I made the following changes:

• Add support for jquery.dropkick select skining validation position
• Add select field invalid for ve_invalid value entry (to be able to display directive without it being a valid selection)
• Add hideAllInstant to remove validation with no delay
• Add support for jquery.simpleImageCheck element if original input is hidden, use location of simpleImageCheck instead
• Add skipValidate class to avoid validation on some fields without disabling them
• Fix error when no match with prompt_err undefined, destination was generating an error
• add clearField support to avoid validating jquery.clearField.js
• add validateHiddenFields, validation on hidden and non-hidden field

In your case you can use the modification for the skipValidate class to perform this. You can find the patched script here along with the english filter (fr one is also available):

jquery.validationEngine.js Patched

jquery.validationEngine-en.js Patched

I should submit those change into git hub, but did not got time to do so right now.

Jerome Godbout

Panthera Dental