Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What does this.optional(element) do when adding a jQuery validation method?

Please see the documentation:
https://jqueryvalidation.org/jQuery.validator.addMethod/

I wonder what this.optional(element) does. I created two forms to test:
Form1 and Form2 — one with this.optional(element) and the other without it. Theoretically speaking and according to a couple of comments on this answer by Andrew Whitaker:

all this.optional does is say "if the field is optional, return true if it is blank"

and

The this.optional check is basically checking to see if the field is blank or not before evaluating whether or not it meets the rule.

But in action I see no difference in how Form1 and Form2 work. Please help me understand the difference in action.

like image 524
Mori Avatar asked Oct 26 '12 20:10

Mori


People also ask

What does JQuery validation do?

Validation in JQuery: Using JQuery, a form is validated on the client-side before it is submitted to the server, hence saves the time and reduce the load on the server. Form Validation means to validate or check whether all the values are filled correctly or not.

Does JQuery validate require a form?

The jquery validate plugin requires a form element to function, so you should have your form fields (no matter how few) contained inside a form. You can tell the validation plugin not to operate on form submission, then manually validate the form when the correct submit button is clicked.

How use JQuery remote validation?

rules: { username: { minlength: 6, maxlength: 12, remote: { url: 'register/isUsernameAvailable', dataType: 'post', data: { 'username': $('#username'). val() }, success: function(data) { if (data. username == 'found') { message: { username: 'The username is already in use!


Video Answer


2 Answers

OK... so in your examples, the field is never blank in either form. Either it has a placeholder value, or an attempt at an email address. The whole point of this.optional(element) is to immediately return true if the element is blank AND it is not required.

So if you had these two methods:

jQuery.validator.addMethod("BOB", function (value, element) {     return this.optional(element) ||          element.value === 'BOB'; }, 'You did not enter BOB');  jQuery.validator.addMethod("mustbeBOB", function (value, element) {     return element.value === 'BOB'; }, 'You did not enter BOB'); 

Adding a class of BOB required would be the same as entering a class of mustbeBOB. Compare that to having a class of BOB which would allow for a blank or "BOB", vs a class of mustbeBOB which will only pass validation with a value of BOB, blank would fail. Does that make more sense?

like image 51
Ryley Avatar answered Sep 20 '22 02:09

Ryley


this.optional is intended to be used in general-purpose validation methods, which might be used with required or optional elements. It allows them to skip all their own checks if the field is not filled in. If the field is optional and blank, the method calling this.optional returns successfully immediately.

By using this, the method can assume that the value is non-empty, which can simplify the rest of its coding.

like image 31
Barmar Avatar answered Sep 22 '22 02:09

Barmar