Databases
StackOverflow2013
Postsdbo
POJQuery unobtrusive validation for array of fields - wired up only to the first one?
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POJQuery unobtrusive validation for array of fields - wired up only to the first one?
    text
    copied!<p>I'm stuck with with adding custom unobtrusive validation to array of fields - data validation attributes are wired up only to the first element (with index 0). Could you please help with this? Thanks.</p> <p>Server Side:</p> <pre class="lang-c# prettyprint-override"><code>public IEnumerable&lt;ModelClientValidationRule&gt; GetClientValidationRules(ModelMetadata metadata, ControllerContext context) { string errorMessage = ErrorMessageString; ModelClientValidationRule timeLessThanRule = new ModelClientValidationRule(); timeLessThanRule.ErrorMessage = errorMessage; timeLessThanRule.ValidationType = "timelessthan"; timeLessThanRule.ValidationParameters.Add("otherpropertyname", _otherPropertyName); yield return timeLessThanRule; } </code></pre> <p>View: </p> <pre class="lang-html prettyprint-override"><code>@for (int i = 0; i &lt; 7; i++) { &lt;div class="form-field"&gt; @Html.HiddenFor(x =&gt; Model.StoreWorkingHours.FirstOrDefault(y =&gt; (int)y.DayInWeek == i + 1 &amp;&amp; y.IntervalInDay == IntervalInDay.IntervalOne).Id, new { @id = "StoreWorkingHours_" + i + "__Id", Name = "StoreWorkingHours[" + i + "].Id" }) @Html.HiddenFor(x =&gt; Model.StoreWorkingHours.FirstOrDefault(y =&gt; (int)y.DayInWeek == i + 1 &amp;&amp; y.IntervalInDay == IntervalInDay.IntervalOne).DayInWeek, new { @id = "StoreWorkingHours_" + i + "__DayInWeek", Name = "StoreWorkingHours[" + i + "].DayInWeek" }) @Html.HiddenFor(x =&gt; Model.StoreWorkingHours.FirstOrDefault(y =&gt; (int)y.DayInWeek == i + 1 &amp;&amp; y.IntervalInDay == IntervalInDay.IntervalOne).IntervalInDay, new { @id = "StoreWorkingHours_" + i + "__IntervalInDay", Name = "StoreWorkingHours[" + i + "].IntervalInDay" }) @Html.TextBoxFor(x =&gt; Model.StoreWorkingHours.FirstOrDefault(y =&gt; (int)y.DayInWeek == i + 1 &amp;&amp; y.IntervalInDay == IntervalInDay.IntervalOne).From, new { @class = "w-50 openedfrom", @id = "StoreWorkingHours_" + i + "__From", Name = "StoreWorkingHours[" + i + "].From" }) &lt;span class="field-validation"&gt;@Html.ValidationMessageFor(x =&gt; Model.StoreWorkingHours.FirstOrDefault(y =&gt; (int)y.DayInWeek == i + 1 &amp;&amp; y.IntervalInDay == IntervalInDay.IntervalOne).From, "", new { @data_valmsg_for = "StoreWorkingHours[" + i + "].From" })&lt;/span&gt; @Html.TextBoxFor(x =&gt; Model.StoreWorkingHours.FirstOrDefault(y =&gt; (int)y.DayInWeek == i + 1 &amp;&amp; y.IntervalInDay == IntervalInDay.IntervalOne).Until, new { @class = "w-50 openeduntil", @id = "StoreWorkingHours_" + i + "__Until", Name = "StoreWorkingHours[" + i + "].Until"}) &lt;span class="field-validation"&gt;@Html.ValidationMessageFor(x =&gt; Model.StoreWorkingHours.FirstOrDefault(y =&gt; (int)y.DayInWeek == i + 1 &amp;&amp; y.IntervalInDay == IntervalInDay.IntervalOne).Until, "", new { @data_valmsg_for = "StoreWorkingHours[" + i + "].Until" })&lt;/span&gt; &lt;/div&gt; } </code></pre> <p>Custom validation script:</p> <pre class="lang-js prettyprint-override"><code> $.validator.addMethod("timelessthan", function (value, element, params) { var index = ($(params).selector).split("[")[1].charAt(0); var tf = $("#StoreWorkingHours_" + index + "__Until").val(); var tu = value; var until = new Date("01/01/2014 " + tu); var from = new Date("01/01/2014 " + tf); return until &lt; from; }); $.validator.unobtrusive.adapters.add("timelessthan", ["otherpropertyname"], function (options) { options.rules["timelessthan"] = "#" + options.params.otherpropertyname; options.messages["timelessthan"] = options.message; }); </code></pre> <p>Result:</p> <pre class="lang-html prettyprint-override"><code>&lt;div class="form-field"&gt; &lt;input type="hidden" value="97" id="StoreWorkingHours_0__Id" name="StoreWorkingHours[0].Id"&gt; &lt;input type="hidden" value="Monday" id="StoreWorkingHours_0__DayInWeek" data-val-required="The DayInWeek field is required." data-val="true" name="StoreWorkingHours[0].DayInWeek"&gt; &lt;input type="hidden" value="IntervalOne" id="StoreWorkingHours_0__IntervalInDay" data-val-required="The IntervalInDay field is required." data-val="true" name="StoreWorkingHours[0].IntervalInDay"&gt; &lt;input type="text" value="" id="StoreWorkingHours_0__From" data-val-timelessthan-otherpropertyname="Until" data-val-timelessthan="From must be less than Until" data-val="true" class="w-50 openedfrom hasTimepicker" name="StoreWorkingHours[0].From"&gt; &lt;span class="field-validation"&gt;&lt;span data-valmsg-replace="true" data-valmsg-for="StoreWorkingHours[0].From" class="field-validation-valid"&gt;&lt;/span&gt;&lt;/span&gt; &lt;input type="text" value="" id="StoreWorkingHours_0__Until" data-val-timegreaterthan-otherpropertyname="From" data-val-timegreaterthan="Until must be greater than From" data-val="true" class="w-50 openeduntil hasTimepicker" name="StoreWorkingHours[0].Until"&gt; &lt;span class="field-validation"&gt;&lt;span data-valmsg-replace="true" data-valmsg-for="StoreWorkingHours[0].Until" class="field-validation-valid"&gt;&lt;/span&gt;&lt;/span&gt; &lt;/div&gt; &lt;div class="form-field"&gt; &lt;input type="hidden" value="97" id="StoreWorkingHours_1__Id" name="StoreWorkingHours[1].Id"&gt; &lt;input type="hidden" value="Tuesday" id="StoreWorkingHours_1__DayInWeek" name="StoreWorkingHours[1].DayInWeek"&gt; &lt;input type="hidden" value="IntervalOne" id="StoreWorkingHours_1__IntervalInDay" name="StoreWorkingHours[1].IntervalInDay"&gt; &lt;input type="text" value="" id="StoreWorkingHours_1__From" class="w-50 openedfrom hasTimepicker" name="StoreWorkingHours[1].From"&gt; &lt;span class="field-validation"&gt;&lt;span data-valmsg-replace="true" data-valmsg-for="StoreWorkingHours[1].From" class="field-validation-valid"&gt;&lt;/span&gt;&lt;/span&gt; &lt;input type="text" value="" id="StoreWorkingHours_1__Until" class="w-50 openeduntil hasTimepicker" name="StoreWorkingHours[1].Until"&gt; &lt;span class="field-validation"&gt;&lt;span data-valmsg-replace="true" data-valmsg-for="StoreWorkingHours[1].Until" class="field-validation-valid"&gt;&lt;/span&gt;&lt;/span&gt; &lt;/div&gt; &lt;div class="form-field"&gt; &lt;input type="hidden" value="97" id="StoreWorkingHours_2__Id" name="StoreWorkingHours[2].Id"&gt; &lt;input type="hidden" value="Wednesday" id="StoreWorkingHours_2__DayInWeek" name="StoreWorkingHours[2].DayInWeek"&gt; &lt;input type="hidden" value="IntervalOne" id="StoreWorkingHours_2__IntervalInDay" name="StoreWorkingHours[2].IntervalInDay"&gt; &lt;input type="text" value="" id="StoreWorkingHours_2__From" class="w-50 openedfrom hasTimepicker" name="StoreWorkingHours[2].From"&gt; &lt;span class="field-validation"&gt;&lt;span data-valmsg-replace="true" data-valmsg-for="StoreWorkingHours[2].From" class="field-validation-valid"&gt;&lt;/span&gt;&lt;/span&gt; &lt;input type="text" value="" id="StoreWorkingHours_2__Until" class="w-50 openeduntil hasTimepicker" name="StoreWorkingHours[2].Until"&gt; &lt;span class="field-validation"&gt;&lt;span data-valmsg-replace="true" data-valmsg-for="StoreWorkingHours[2].Until" class="field-validation-valid"&gt;&lt;/span&gt;&lt;/span&gt; &lt;/div&gt; &lt;div class="form-field"&gt; &lt;input type="hidden" value="97" id="StoreWorkingHours_3__Id" name="StoreWorkingHours[3].Id"&gt; &lt;input type="hidden" value="Thursday" id="StoreWorkingHours_3__DayInWeek" name="StoreWorkingHours[3].DayInWeek"&gt; &lt;input type="hidden" value="IntervalOne" id="StoreWorkingHours_3__IntervalInDay" name="StoreWorkingHours[3].IntervalInDay"&gt; &lt;input type="text" value="" id="StoreWorkingHours_3__From" class="w-50 openedfrom hasTimepicker" name="StoreWorkingHours[3].From"&gt; &lt;span class="field-validation"&gt;&lt;span data-valmsg-replace="true" data-valmsg-for="StoreWorkingHours[3].From" class="field-validation-valid"&gt;&lt;/span&gt;&lt;/span&gt; &lt;input type="text" value="" id="StoreWorkingHours_3__Until" class="w-50 openeduntil hasTimepicker" name="StoreWorkingHours[3].Until"&gt; &lt;span class="field-validation"&gt;&lt;span data-valmsg-replace="true" data-valmsg-for="StoreWorkingHours[3].Until" class="field-validation-valid"&gt;&lt;/span&gt;&lt;/span&gt; &lt;/div&gt; &lt;div class="form-field"&gt; &lt;input type="hidden" value="97" id="StoreWorkingHours_4__Id" name="StoreWorkingHours[4].Id"&gt; &lt;input type="hidden" value="Friday" id="StoreWorkingHours_4__DayInWeek" name="StoreWorkingHours[4].DayInWeek"&gt; &lt;input type="hidden" value="IntervalOne" id="StoreWorkingHours_4__IntervalInDay" name="StoreWorkingHours[4].IntervalInDay"&gt; &lt;input type="text" value="" id="StoreWorkingHours_4__From" class="w-50 openedfrom hasTimepicker" name="StoreWorkingHours[4].From"&gt; &lt;span class="field-validation"&gt;&lt;span data-valmsg-replace="true" data-valmsg-for="StoreWorkingHours[4].From" class="field-validation-valid"&gt;&lt;/span&gt;&lt;/span&gt; &lt;input type="text" value="" id="StoreWorkingHours_4__Until" class="w-50 openeduntil hasTimepicker" name="StoreWorkingHours[4].Until"&gt; &lt;span class="field-validation"&gt;&lt;span data-valmsg-replace="true" data-valmsg-for="StoreWorkingHours[4].Until" class="field-validation-valid"&gt;&lt;/span&gt;&lt;/span&gt; &lt;/div&gt; &lt;div class="form-field"&gt; &lt;input type="hidden" value="97" id="StoreWorkingHours_5__Id" name="StoreWorkingHours[5].Id"&gt; &lt;input type="hidden" value="Saturday" id="StoreWorkingHours_5__DayInWeek" name="StoreWorkingHours[5].DayInWeek"&gt; &lt;input type="hidden" value="IntervalOne" id="StoreWorkingHours_5__IntervalInDay" name="StoreWorkingHours[5].IntervalInDay"&gt; &lt;input type="text" value="" id="StoreWorkingHours_5__From" class="w-50 openedfrom hasTimepicker" name="StoreWorkingHours[5].From"&gt; &lt;span class="field-validation"&gt;&lt;span data-valmsg-replace="true" data-valmsg-for="StoreWorkingHours[5].From" class="field-validation-valid"&gt;&lt;/span&gt;&lt;/span&gt; &lt;input type="text" value="" id="StoreWorkingHours_5__Until" class="w-50 openeduntil hasTimepicker" name="StoreWorkingHours[5].Until"&gt; &lt;span class="field-validation"&gt;&lt;span data-valmsg-replace="true" data-valmsg-for="StoreWorkingHours[5].Until" class="field-validation-valid"&gt;&lt;/span&gt;&lt;/span&gt; &lt;/div&gt; &lt;div class="form-field"&gt; &lt;input type="hidden" value="97" id="StoreWorkingHours_6__Id" name="StoreWorkingHours[6].Id"&gt; &lt;input type="hidden" value="Sunday" id="StoreWorkingHours_6__DayInWeek" name="StoreWorkingHours[6].DayInWeek"&gt; &lt;input type="hidden" value="IntervalOne" id="StoreWorkingHours_6__IntervalInDay" name="StoreWorkingHours[6].IntervalInDay"&gt; &lt;input type="text" value="" id="StoreWorkingHours_6__From" class="w-50 openedfrom hasTimepicker" name="StoreWorkingHours[6].From"&gt; &lt;span class="field-validation"&gt;&lt;span data-valmsg-replace="true" data-valmsg-for="StoreWorkingHours[6].From" class="field-validation-valid"&gt;&lt;/span&gt;&lt;/span&gt; &lt;input type="text" value="" id="StoreWorkingHours_6__Until" class="w-50 openeduntil hasTimepicker" name="StoreWorkingHours[6].Until"&gt; &lt;span class="field-validation"&gt;&lt;span data-valmsg-replace="true" data-valmsg-for="StoreWorkingHours[6].Until" class="field-validation-valid"&gt;&lt;/span&gt;&lt;/span&gt; &lt;/div&gt; </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload