placeholder issue with jQuery Validate

Question

I noticed today that we have an issue with jquery Validate when used in conjunction with placeholder text.

Example:

&         


        
      

Answer 1

I was coming across the same issue. After some messing around, found a workaround with this custom method. This custom method will accommodate placeholders.

jQuery.validator.addMethod("placeholder", function(value, element) {
  return value!=$(element).attr("placeholder");
}, jQuery.validator.messages.required);

Tag this line at the end of the additional-methods.js file.

You'll then use it as follows:

$("form").validate({
  rules: {
    username: {required: true, placeholder: true},
  },
  message: {
    username: {
      required: "Username required", placeholder: "Username required",
    },
  }
});