asp.netmvcページでjquerydaterangeバリデーターを使用していますhttp://docs.jquery.com/Plugins/Validation/multiplefields。私のhtmlは次のようになります：
<tr>
<td align="left" valign="top">
<label>
<input name="fromDate" type="text" class="flat requiredDateRange jq_watermark" id="fromDate"
style="width: 190px" title="Creation From Date" readonly="readonly" />
</label>
</td>
</tr>
<tr>
<td align="left" valign="top">
<label>
<input name="toDate" type="text" class="flat requiredDateRange jq_watermark" id="toDate"
style="width: 190px" title="Creation To Date" readonly="readonly" />
</label>
</td>
</tr>
<tr>
<td colspan="3" align="left" valign="top">
<label id="error" class="error" style="display: block;">
</label>
</td>
</tr>
ページ上部のように、私はこれを使用しています：
$(document).ready(function(){
$("#fromDate").datepicker({ dateFormat: 'dd MM yy', changeYear: true, changeMonth: true });
$("#toDate").datepicker({ dateFormat: 'dd MM yy', changeYear: true, changeMonth: true });
});
と
jQuery(function () {
jQuery("#frmSearch").validate({
groups: {
datesnotnull: "fromDate toDate",
dateRange: "fromDate toDate"
},
errorPlacement: function (error) {
jQuery("#frmSearch").find("#error").append('error');
jQuery("#frmSearch").find("#error").show();
}
});
});
私のdaterangevalidatorファイルは次のようになります。
// a custom method for validating the date range
$.validator.addMethod("datesnotnull", function () {
return (($("#fromDate").val().length != 0) && ($("#toDate").val().length != 0)) || (($("#fromDate").val().length == 0) && ($("#toDate").val().length == 0));
}, "Please specify the date range, from and to date.");
// a custom method for validating the date range
$.validator.addMethod("dateRange", function () {
return ((($("#fromDate").val().length==0) && ($("#toDate").val().length==0)) || (new Date($("#fromDate").val()) < new Date($("#toDate").val())));
}, "Please specify a correct date range, the from date must be before the to date.");
// a new class rule to group all three methods
$.validator.addClassRules({
requiredDateRange: { required: false, date: true, datesnotnull : true , dateRange: true }
});
// overwrite default messages
$.extend($.validator.messages, {
date: "Please specify valid dates"
});
しかし、todateがデータよりも少ない場合、「CreationToDate」メッセージのみが表示されます。赤色のデフォルトメッセージである「正しい日付範囲を指定してください。開始日は終了日より前である必要があります」というメッセージを表示したい