I am observing some strange behavior. Under some circumstances including, if I call valid on any of the fields, the way "This field is required" is displayed changes. Why is this happening? Perhaps any kind of error on the page?
1 Answer
The message This field is required comes from jquery-validate.js, which runs when you call .valid().
The messasge [!] Please select an item in the list comes from the browser's built-in validation when you have the required attribute in the element. It does this check when the form is being submitted.
If you don't want the browser's validation, don't put attributes like required in the HTML. jquery-validate understands class="required", or you can put the specification of which fields are required in the rules when you initialize the plugin:
$("#formid").validate({
rules: {
customer: "required",
}
});
6 Comments
kos
Thank you, this must be it. I am fairly new to this appreciate your help. I do like the browser default display? What is the preferred/recommended way to do validation? jquery validator or browser? I was mixing them up apparently. Using different validators for different fields ok? I guess look wise not that great...
Barmar
jquery-validator gives you lots of validation options that the browser doesn't have, including the ability to create custom validation rules. It also provides lots of customization features, so you can provide your own messages, and control how they're displayed. So it depends on how much you want to do.kos
that is exactly why I added it in a first place. just could not figure out inconsistency. the way messages are displayed are not great of course. Thanks again.
Sparky
Just to be clear, when using the jQuery Validate plugin, the
novalidate attribute is added to the form automatically. In other words, you would only get the HTML5 popup if jQuery Validate is not installed and initialized. Also, the jQuery Validate plugin will automatically handle the required attribute exactly the same as the required class.Barmar
@Sparky I forgot about that
novalidate attribute. I wonder why he's seeing the built-in message, then. I know that it handles the required attribute, I was just showing how to tell jquery-validate that it's required in a way that the browser won't notice. |
[!]is the browser's built-in validation.This field is requiredcomes from jquery-validate.