I'm using jQuery Validation Plugin, v1.11.0,2/4/2013 with jquery.validate.unobtrusive.js.
I guess I face a bug of Range validation for numeric field: Validation compares String value with String of Min and String of Max, instead of comparing Number of field with min-number and max-number.
Repro-steps:
You set validation range 1-1000, using following HTML:
<input name="Data.MaxConcurrentInstances" class="text-box single-line" id="Data_MaxConcurrentInstances" type="number" value="" data-val-number="The field Max concurrent instances must be a number." data-val="true" data-val-range-min="1" data-val-range-max="1000" data-val-range="The field Max concurrent instances must be between 1 and 1000.">
You set test field value: 7.
Expected results: Validation successfull. No errors.
Actual results: Validation fails. Internal reason: it fails because alphabetically string "7" goes after string "1" and "1000", not between them.
Question: Is it this bug known? What is the best workaround for that?
Unobtrusive Validation means without writing a lot of validation code, you can perform simple client-side validation by adding the suitable attributes and including the suitable script files. data-val-required=”This is required.”
The isNumeric() method in jQuery is used to determine whether the passed argument is a numeric value or not. The isNumeric() method returns a Boolean value. If the given argument is a numeric value, the method returns true; otherwise, it returns false. This method is helpful as it decreases the lines of code.
validator. unobtrusive. parse(selector) method to force parsing. This method parses all the HTML elements in the specified selector and looks for input elements decorated with the [data-val=true] attribute value and enables validation according to the data-val-* attribute values.
valid() from the jQuery Validation plugin: $("#form_id"). valid(); Checks whether the selected form is valid or whether all selected elements are valid.
One of the workaround would be to override the range method of jquery validator as follows:
$.validator.methods.range = function (value, element, param) {
return this.optional(element) || (Number(value) >= Number(param[0]) && Number(value) <= Number(param[1]));
}
The actual code for range in the validator plugin is
range : function (value, element, param) {
return this.optional(element) || (value >= param[0] && value <= param[1]);
}
On converting the String type value in the value, param[0] and param[1]
to Number type using Number(value), Number(param[0]) and Number(param[1])
a proper comparison occurs between Number and not between String.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With