asp.net-mvc - 如何为Kendo UI DropDownList和ComboBox启用ASP.Net MVC客户端验证?

标签 asp.net-mvc jquery-validate kendo-ui unobtrusive-validation

当我在MVC Razor View 中使用Kendo UI ComboBox和DropDownList控件时,不会触发客户端验证。这是一个例子:

@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"
        }, 
    };
}

提交表单时,非Kendo UI下拉列表会适当显示验证错误,但Kendo控件则不会。请让我知道是否有一种方法可以为这些控件启用客户端验证,而不必手动将其连接起来。

完整的示例解决方案附在以下Kendo论坛帖子上:
http://www.kendoui.com/forums/mvc/dropdownlist/mvc-client-validation-not-working.aspx

最佳答案

根据Kendo论坛上的响应,验证不起作用的原因是因为jquery validate缺省情况下不验证隐藏字段。最简单的更改方法是使用$ .validate.setDefaults方法覆盖该行为,如下所示:

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

这仍然不会向组合框或下拉菜单中添加“input-validation-error”类,但至少会添加验证错误,并阻止表单提交。

关于asp.net-mvc - 如何为Kendo UI DropDownList和ComboBox启用ASP.Net MVC客户端验证?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12306737/

相关文章:

javascript - 3 秒后刷新对 Controller 的 JavaScript 和 Ajax 调用,无需在 MVC 4 中的 Razor View 中进行任何单击

jquery validate 添加方法来验证日期时间

jquery - Bootstrap 4 和 jQuery 验证插件

javascript - 如何替换现有的 Kendo UI 小部件?

kendo-ui - Kendo网格与MVVM,绑定(bind)列可见性

javascript - KendoUI TreeView 动态 JSON

asp.net-mvc - 无法使用 Windows 身份验证通过 ASP.NET 应用程序中的个人访问 token 对 Azure DevOps 进行身份验证

c# - Autofac - 自动注册错误 : No constructors can be found with 'Public binding flags'

c# - Azure 上的 Asp.net MVC 5.2.2

jQuery 验证 HTML5 中的正则表达式