2016-04-30 39 views
1

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

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' 
}); 
}) 

回答

1

尝试设置验证验证隐藏字段。剑道会隐藏日期的原始输入。

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