使用jquery datepicker进行Jquery客户端验证

时间:2015-07-29 22:25:54

标签: javascript jquery validation datepicker

验证过去有效,但我转而使用datepicker。我注意到客户端验证并不总是受到影响。可能需要几个日期选择才能达到断点。但是,如果你选择一个日期并且仍然在文本框中并按Enter键,则每次都有效。

我在视图中加载了正确的脚本。我的验证方法只是

[HttpPost]
public JsonResult CheckEndDate(DateTime CourseEndDate, DateTime CourseStartDate)
{
    return Json(CourseStartDate < CourseEndDate);
}

我的模型属性

[Remote("CheckEndDate", "Course", AdditionalFields = "CourseStartDate", HttpMethod = "POST",
    ErrorMessage = "Must end after Start Date")]

查看内容

@model Nullable<DateTime>
@{
    DateTime date = DateTime.Now;

    if (Model != null) {
        date = (System.DateTime) Model;
    }
}
@Html.TextBox("", String.Format("{0:MMM dd, yyyy}", date),
  new { @class = "datefield", type = "text"  })

<td class="table-row">
    @Html.EditorFor(model => model.CourseStartDate)
    @Html.ValidationMessageFor(model => model.CourseStartDate)
</td>
<td class="table-row">
    @Html.EditorFor(model => model.CourseEndDate)
    @Html.ValidationMessageFor(model => model.CourseEndDate)
</td>
//Date field datepicker hookup
$('.datefield').datepicker({dateFormat:'M dd, yy'});

重新注意,我没有使用日期选择器,除了谷歌,并想要一个crossbrowser。它正在处理每个日期变更。现在它的工作时间只有一半,或者只能按下输入。

如果您还有其他需要,请告诉我。

1 个答案:

答案 0 :(得分:0)

在我的项目中,我做了我的验证:

$(".datepicker").datepicker().on('changeDate', function (ev) {
     //Your validation goes here
     if(!good){
       ev.setValue("");
       alert("Your date is invalide!");
     }
});