validation - 如何在 Ajax.BeginForm 中验证 Kendo DateTimePickerFor？

Question

我有一个 ajax 表单，其中包含需要验证的 3 个 Kendo DateTimePickerFor 小部件。我只想确保日期有效，以防用户在文本框中键入日期时间。禁用文本框（不禁用整个控件）也可以，但我也没有成功。任何帮助，将不胜感激。这是我的cshtml代码：

@using (Ajax.BeginForm("SaveEditDemographics", "Attribution", null, new AjaxOptions()
{
    UpdateTargetId = "frmEditDemographics",
    InsertionMode = InsertionMode.Replace,
    OnSuccess = "saveSuccess"
}, new { id = "frmEditDemographics", autocomplete = "off" }))
{
    <div class="modal-header">
        <h5 class="modal-title" id="modalTitle">Edit Beneficiary Demographics</h5>
    </div>
    <div class="modal-body" style="max-height:70vh; overflow-y:auto">
        <div class="row mb-2">
            <div class="col-lg-8">
                <div class="form-group">
                    @Html.LabelFor(m => m.ID, new { @class = "text-dark font-weight-bold" })
                    @Html.TextBoxFor(m => m.ID, new { @class = "form-control", @readonly = "readonly" })
                </div>
            </div>
        </div>
        <div class="row mb-2">
            <div class="col-lg-8">
                <div class="form-group">
                    @Html.LabelFor(m => m.AcoId, new { @class = "text-dark font-weight-bold" })
                    @Html.TextBoxFor(m => m.AcoId, new { @class = "form-control", @readonly = "readonly" })
                </div>
            </div>
        </div>
        <div class="row mb-2">
            <div class="col-lg-8">
                <div class="form-group">
                    @Html.LabelFor(m => m.AcoName, new { @class = "text-dark font-weight-bold" })
                    @Html.TextBoxFor(m => m.AcoName, new { @class = "form-control", @readonly = "readonly" })
                </div>
            </div>
        </div>
        <div class="row mb-2">
            <div class="col-lg-8">
                <div class="form-group">
                    @Html.LabelFor(m => m.MbiId, new { @class = "text-dark font-weight-bold" })
                    @Html.TextBoxFor(m => m.MbiId, new { @class = "form-control", @readonly = "readonly" })
                </div>
            </div>
        </div>
        <div class="row mb-2">
            <div class="col-lg-4">
                <div class="form-group">
                    @Html.LabelFor(m => m.FirstName, new { @class = "text-dark font-weight-bold" })
                    @Html.TextBoxFor(m => m.FirstName, new { @class = "form-control" })
                </div>
            </div>
            <div class="col-lg-4">
                <div class="form-group">
                    @Html.LabelFor(m => m.MiddleName, new { @class = "text-dark font-weight-bold" })
                    @Html.TextBoxFor(m => m.MiddleName, new { @class = "form-control" })
                </div>
            </div>
            <div class="col-lg-4">
                <div class="form-group">
                    @Html.LabelFor(m => m.LastName, new { @class = "text-dark font-weight-bold" })
                    @Html.TextBoxFor(m => m.LastName, new { @class = "form-control" })
                </div>
            </div>
        </div>
        <div class="row mb-2">
            <div class="col-lg-6">
                <div class="form-group">
                    @Html.LabelFor(m => m.Race, new { @class = "text-dark font-weight-bold" })
                    <br />
                    @Html.DropDownListFor(m => m.Race, new SelectList(ViewBag.RaceOptions, Model.Race), new { @class = "form-control p-1 w-auto" })
                </div>
            </div>
            <div class="col-lg-6">
                <div class="form-group">
                    @Html.LabelFor(m => m.Sex, new { @class = "text-dark font-weight-bold" })
                    <br />
                    @Html.DropDownListFor(m => m.Sex, new SelectList(ViewBag.SexOptions, Model.Sex), new { @class = "form-control p-1 w-auto" })
                </div>
            </div>
        </div>
        <div class="row mb-2">
            <div class="col-lg-4">
                <div class="form-group">
                    @Html.LabelFor(m => m.DOB, new { @class = "text-dark font-weight-bold" })
                    <br />
                    @(Html.Kendo().DateTimePickerFor(m => m.DOB).HtmlAttributes(new { data_toggle = "tooltip", data_placement = "bottom", data_trigger = "focus" }))
                </div>
            </div>
            <div class="col-lg-4">
                <div class="form-group">
                    @Html.LabelFor(m => m.ActDate, new { @class = "text-dark font-weight-bold" })
                    <br />
                    @(Html.Kendo().DateTimePickerFor(m => m.ActDate).HtmlAttributes(new {data_toggle = "tooltip", data_placement = "bottom", data_trigger = "focus" }))
                </div>
            </div>
            <div class="col-lg-4">
                <div class="form-group">
                    @Html.LabelFor(m => m.DeathDTTM, new { @class = "text-dark font-weight-bold" })
                    <br />
                    @(Html.Kendo().DateTimePickerFor(m => m.DeathDTTM).HtmlAttributes(new {data_toggle = "tooltip", data_placement = "bottom", data_trigger = "focus" }))
                </div>
            </div>
        </div>

        <div class="row mb-2">
            <div class="col-12">
                <div class="form-group">
                    @Html.LabelFor(m => m.AddrLine1, new { @class = "text-dark font-weight-bold" })
                    @Html.TextBoxFor(m => m.AddrLine1, new { @class = "form-control" })
                </div>
            </div>
        </div>
        <div class="row mb-2">
            <div class="col-lg-4">
                <div class="form-group">
                    @Html.LabelFor(m => m.CityName, new { @class = "text-dark font-weight-bold" })
                    @Html.TextBoxFor(m => m.CityName, new { @class = "form-control" })
                </div>
            </div>
            <div class="col-lg-4">
                <div class="form-group">
                    @Html.LabelFor(m => m.ZipCode, new { @class = "text-dark font-weight-bold" })
                    @Html.TextBoxFor(m => m.ZipCode, new { @class = "form-control" })
                </div>
            </div>
            <div class="col-lg-4">
                <div class="form-group">
                    @Html.LabelFor(m => m.StateAbbrev, new { @class = "text-dark font-weight-bold" })
                    <br />
                    @Html.DropDownListFor(m => m.StateAbbrev, new SelectList(ViewBag.StateAbbrevOptions, Model.StateAbbrev), new { @class = "form-control p-1 w-auto" })
                </div>
            </div>
        </div>


    </div>

    <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
        <button type="submit" class="btn btn-primary">Submit</button>
    </div>
}