JQuery.validator.unobtrusive.adapters.addMinMax round trip, not working in MVC3

Question

I am creating a daily range validator using DataAnnotations, jQuery.validate and jquery.validate.unobtrusive. I already read the following: http://bradwilson.typepad.com/blog/2010/10/mvc3-unobtrusive-validation.html

http://weblogs.asp.net/mikaelsoderstrom/archive/2010/10/06/unobtrusive-validation-in-asp-net-mvc-3.aspx

and others, but cannot publish them (noob)

Like most posts on SO. I forbid my head against the wall, any help can be rewarded with beer / food / code / etc .;) In any case, the code here:

I have a model object with the following parameter:

[Display(Name = "Start date"), DayRange(0, 5, ErrorMessage = "The Start Date must be between today and 5 days time.")] public DateTime StartDate { get; set; } 

DayRange is a custom attribute class:

 [AttributeUsage(AttributeTargets.Field | AttributeTargets.Property, AllowMultiple = false, Inherited = true)] public class DayRangeAttribute : RangeAttribute, IClientValidatable { private int _minimumDays; private int _maximumDays; public DayRangeAttribute(int minimumDays, int maximumDays) : base(minimumDays, maximumDays) { _minimumDays = minimumDays; _maximumDays = maximumDays; } public override bool IsValid(object value) { var dateToBeTested = value as DateTime?; return dateToBeTested.HasValue && dateToBeTested.Value >= DateTime.Today.AddDays(_minimumDays) && dateToBeTested.Value <= DateTime.Today.AddDays(_maximumDays); } public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context) { var rule = new ModelClientValidationRule { ErrorMessage = this.ErrorMessage, ValidationType = "dayrange" }; rule.ValidationParameters.Add("min", _minimumDays); rule.ValidationParameters.Add("max", _maximumDays); yield return rule; } } 

In my web.config there is the following:

 <appSettings> <add key="ClientValidationEnabled" value="true"/> <add key="UnobtrusiveJavaScriptEnabled" value="true"/> </appSettings> 

I have the following JS trigger before the document is ready (tried to run it when the document is ready too):

 jQuery.validator.addMethod('dayrange', function (value, element, param) { if (!value) return false; var now = Date(); var dateValue = Date.parse(value); var minDate = now.setDate(now.getDate() - param.min); var maxDate = now.setDate(now.getDate() + param.max); return this.optional(element) && dateValue >= minDate && dateValue <= maxDate; }, 'Must fall in range'); jQuery.validator.unobtrusive.adapters.addMinMax('dayrange', 'minlength', 'maxlength', 'dayrange'); 

What am I doing wrong? Thanks in advance, Jol

Answer 1

Solved! I forgot / didn't understand what you need to pass jQuery itself to function closure. Therefore, the client-side custom validator should look like this:

 $(function () { jQuery.validator.addMethod('dayRange', function (value, element, param) { if (!value) return false; var valueDateParts = value.split(param.seperator); var minDate = new Date(); var maxDate = new Date(); var now = new Date(); var dateValue = new Date(valueDateParts[2], (valueDateParts[1] - 1), valueDateParts[0], now.getHours(), now.getMinutes(), (now.getSeconds()+5)); minDate.setDate(minDate.getDate() - parseInt(param.min)); maxDate.setDate(maxDate.getDate() + parseInt(param.max)); return dateValue >= minDate && dateValue <= maxDate; }); jQuery.validator.unobtrusive.adapters.add('dayrange', ['min', 'max', 'dateseperator'], function (options) { var params = { min: options.params.min, max: options.params.max, seperator: options.params.dateseperator }; options.rules['dayRange'] = params; if (options.message) { options.messages['dayRange'] = options.message; } }); }(jQuery)); 

I also change the way the adapter is added to unobtrusive to add additional properties. Never send a server developer to do the work of engineers at the forefront;) I hope this helps someone.

Answer 2

Link: http://bradwilson.typepad.com/blog/2010/10/mvc3-unobtrusive-validation.html

adapters.addMinMax() orderby this parameter:

 adapterName, minRuleName, maxRuleName, minMaxRuleName, minAttribute, maxAttribute 

so you need this:

 jQuery.validator.unobtrusive.adapters.addMinMax('dayrange', '', '', 'dayrange','minlength', 'maxlength'); AND,,, param.min, param.max be sure to undefine. param is an purely array as: ['111','000']. 

so what you need:

 var minDate = now.setDate(now.getDate() - param[0]); var maxDate = now.setDate(now.getDate() + param[1]);