如何为Kendo UI DropDownList和ComboBox启用ASP.Net MVC客户端验证？

当我在MVC Razor视图中使用Kendo UI组合框和DropDownList控件时，客户端验证不会触发。这里有一个例子：如何为Kendo UI DropDownList和ComboBox启用ASP.Net MVC客户端验证？

@using Kendo.Mvc.UI 
@model KendoDropDownTest.Models.TestModel 

@{ 
    ViewBag.Title = "Kendo Drop Down and Combo Box Test"; 
} 

<h2>Kendo Drop Down and Combo Box Test</h2> 

@using (Html.BeginForm()) 
{ 
    @Html.ValidationSummary() 

     <div> 
      @Html.LabelFor(x => x.DropDownValue) 
      @(Html.DropDownListFor(x => x.DropDownValue, Model.Options, "-- Select an Option --")) 
      @Html.ValidationMessageFor(x => x.DropDownValue) 
     </div> 

    <fieldset> 
     <legend>Kendo</legend> 
     <div> 
      @Html.LabelFor(x => x.KendoComboValue) 
      @(Html.Kendo().ComboBoxFor(x => x.KendoComboValue) 
        .BindTo(Model.Options.Select(x => x.Text))) 
      @Html.ValidationMessageFor(x => x.KendoComboValue) 
     </div> 

     <div> 
      @Html.LabelFor(x => x.KendoDropDownValue) 
      @(Html.Kendo().DropDownListFor(x => x.KendoDropDownValue) 
       .OptionLabel("-- Select an Option --") 
       .BindTo(Model.Options)) 
      @Html.ValidationMessageFor(x => x.KendoDropDownValue) 
     </div> 
    </fieldset> 

    <input type="submit" value="Submit" /> 
}

，对应的模式：

public class TestModel 
{ 
    [Required] 
    public string DropDownValue { get; set; } 
    [Required] 
    public string KendoComboValue { get; set; } 
    [Required] 
    public string KendoDropDownValue { get; set; } 

    public SelectListItem[] Options = new[] 
    { 
     new SelectListItem 
     { 
      Text = "Option 1", 
      Value = "1" 
     }, 
     new SelectListItem 
     { 
      Text = "Option 2", 
      Value = "2" 
     }, 
     new SelectListItem 
     { 
      Text = "Option 3", 
      Value = "3" 
     }, 
    }; 
}

非剑道UI下拉适当显示验证错误时提交表单，但剑道控件不。请让我知道是否有办法为这些控件启用客户端验证，而无需手动连线。

完整的例子液附着于以下剑道论坛上发帖： http://www.kendoui.com/forums/mvc/dropdownlist/mvc-client-validation-not-working.aspx

来源

2012-09-06 Jason Smale

基于对剑道论坛的响应，验证不起作用的原因是因为JQuery验证不验证默认隐藏域。改变这种状况的最简单方法是使用$ .validate.setDefaults方法重写该行为，像这样：

$.validator.setDefaults({ 
    ignore: "" 
});

这仍然没有在“输入验证错误”类添加到组合框或降但至少会增加验证错误，并且不会提交表单。

来源

2012-09-10 17:05:40

对于jQuery验证1.9，你必须[组'ignore'为空数组（http://stackoverflow.com/a/8565769/26226）。 – jrummell

发现了一个很好的补充。如果您有其他控件，如果隐藏时不想验证其他控件，但希望隐藏特定控件，则可以将它们添加到不（忽略）以展开此有用提示：例如，我们将.kendoDD标记在Kendo Dropdown上，然后设置： $ .validator.setDefaults（{0：隐藏：不（（.kendoDD）“ }）; https://stackoverflow.com/questions/20287567/ignore-all-hidden-div-but-not-one-in-jquery-validation – Mike

在尝试了很多东西之后，我得出了一个结论：使用jQuery unobtrusive js库和kendo验证的ASP.NET MVC验证是两个不同的不兼容的野兽。我使用服务器端和客户端代码验证了一个kendo Multi-Select控件，但是没有任何工作真正起作用，包括jQuery验证器（$ .validator）上的setDefaults（）方法。我终于找到了这篇文章http://www.macaalay.com/2014/02/15/enabling-asp-net-mvc-client-validation-for-kendo-ui-components/，并且不得不单独挂上了kendo验证，并提醒说它没有集成到ASP.NET MVC验证摘要控件和一般的ASP.NET MVC验证API中。

下面是代码片段，以演示必须完成的工作。再次，可以有一个更清洁和更好的方法。这段代码与我的ViewModel对象上的绑定属性“SelectedIDs”中的Required验证属性一起使用。 “divCategories”是包含kendo多选控件的div元素。这一次，现在对我的作品，直到我得到一个更简洁的方法：

Html.Kendo().MultiSelectFor(m => m.SelectedIDs) 
      .Name("SelectedIDs") 
      .BindTo(CategoryItems) 
      .HtmlAttributes(new { @class = "height100pc", @onchange= "$('#divCategories').kendoValidator().validate();" })

你可以的javascript插入脚本代码或到公用JavaScript文件反正内嵌分开。

好运谁踹这条路..

来源

2015-11-30 13:54:25 Sudhir

如何为Kendo UI DropDownList和ComboBox启用ASP.Net MVC客户端验证？

回答

相关问题