Numeric Range validation does not work properly in jquery.validate.unobtrusive.js

Question

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?

Answer 1

I also see this issue. I just confirmed that it is fixed in JQuery Validation 1.11.1 update by updating my code manually. The update is not yet published on the NuGET repositories.

You can download the update from here: http://bassistance.de/jquery-plugins/jquery-plugin-validation/

The Microsoft CDN addresses are:

http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js

http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js

---

Update from April 3rd:

the NuGET package update is now available. If you update to JQuery Validation 1.11.1 via NuGET you'll have the issue fixed.

Answer 2

So far the best workaround I found is running patching start up script:

$(document).ready(function() {
    window.setTimeout(function () {
        //Fixing jquery Unobtrusive validation range integer bug
        var allRules = $.data(document.forms[0], "validator").settings.rules;
        for (var ruleName in allRules) {
            var rule = allRules[ruleName];

            if (rule.range != undefined && rule.number)
                for (var ri = rule.range.length-1; ri >=0 ; ri--) {
                    rule.range[ri] = Number(rule.range[ri]);
                }
        }
    }, 100);
});

Answer 3

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.