带有 JQuery 验证的 Kendo DatePickerFor

Question

我在使用 Telerik Kendo DatePickerFor 控件时被阻止了几天。在添加 DatePickerFor 控件之前，所有其他控件都运行良好。它应该验证“ProjectName”下拉列表和其他复选框（在这篇文章中被忽略），所有错误消息都挂在 UI 页面的顶部。添加日期选择器控件和验证后，模型确实获得了正确的 http post 和日期时间，但如果任何输入无效，则不会显示任何验证消息。如果删除日期时间选择器控件，验证将恢复正常。任何线索表示赞赏。

Cshtml

@section Scripts {
    @Scripts.Render("~/bundles/kendo")
    <script src="~/Scripts/custom.validate.js"></script>
    <script type="text/javascript">
        $.validator.setDefaults({
            ignore: ""
        });
    </script>
}
@(Html.Kendo().DropDownListFor(model => model.ProjectName).Name("ProjectName")...)
@Html.Kendo().DatePickerFor(model => model.UptoTimestamp)

型号

public class IntegrationModel
{
    public string ProjectName { get; set; }
    public DateTime? UptoTimestamp { get; set; }
}

JQuery 验证器

$(document).ready(function () {

$.validator.addMethod("validateType",
    function (value, element) {
        return $('#rbFor')[0].checked || $('#rbRev')[0].checked;
    });

$.validator.addMethod("validateUptoTimestamp",
    function (element) {
        var value = $(element).val();
        var date = kendo.parseDate(value);
        if (!date) {
            return false;
        }
        return true;
    });

$('#schedule_form').validate({
 rules: {
        ProjectName: {
            required: true
        },
        UptoTimestamp: {
            validateUptoTimestamp: true
        }
    },
    messages: {
        ProjectName: {
            required: "Please select a project"
        },
        UptoTimestamp: {
            required: "Please provide a valid time stamp"
        }
    },
    errorContainer: $('#errorContainer'),
    errorLabelContainer: $('#errorContainer ul'),
    wrapper: 'li'
});
})

Answer 1

尝试设置验证器来验证隐藏字段。 Kendo 将隐藏日期的原始输入。

$("#schedule_form").validate().settings.ignore = ":hidden:not(input)";