Question

我正在努力弄清楚为什么我的剑道验证不起作用......但首先让我备份。

我有一个带有页面和按钮的mvc 5网络应用程序。单击按钮，模态kendoWindow显示部分视图以捕获用户的两个输入。我有我认为的传统MVC验证过程。

[Validator(typeof(MyModelValidator))]
public partial class MyModel
{ ... }

然而，它会向控制器发布一个无效模型（我正在测试无效提交）状态然后立即抛出一个错误，因为它无法完全处理更新它刚刚来自验证的“模态”局部视图检查必填字段消息。

因此，在研究和阅读后，我确定......可能不正确......使用kendo验证器是这种情况的唯一选择。

所以我开始实现以下Telerik文档。

在模型中我有5个属性，但我只装饰了一个，我会在完成所有操作之前将其删除。所以我注释掉了我的MVC验证器并将其添加到我的模型中：

[Required]
[Display(Name = "Financial Named")]
public virtual string FinancialInstitutionName { get; set; }

在cshtml中：

 ....snip.....
    @Html.LabelFor(model => model.FinancialInstitutionName):
 </td>
 <td>
    @Html.EditorFor(model => model.FinancialInstitutionName)
    @Html.ValidationMessageFor(model => model.FinancialInstitutionName)
 </td>
 .....and further down.....
 $(function ()
 {
    $("#formCreateEditFinancier").kendoValidator();
 });

控制器：

public ActionResult CreateEditFinancialInstitute(int financierId, int isChanging)
{
  var model = new FinancierModel();
  return
  PartialView("~/.../CreateEditFinancialInstitute.cshtml", model);
}

现在，上面是在模态对话框中渲染局部视图时生成/消耗的内容。

以下是“父”页面使用启动模态对话框的按钮...

 var window = $("#window").kendoWindow(
 {
    modal: true,
    width: "600px",
    height: "400px",
    title: "Fill in the blanks eh...",
    actions: ["Close"],
    content: {
               url: "@Html.Raw(Url.Action("CreateEditFinancialInstitute", "FinancingPayment"))",
               data: { financierId: financierid, isChanging: ischanging }
              }
   });
   window.data('kendoWindow').center();

最后这里是生成的模态窗口的html。

<form id="formCreateEditFinancier" action="/FinancingPayment/CreateEditFinancialInstitute" method="post" novalidate="novalidate" data-role="validator">

什么是novalidate属性？我读到了它，它似乎是html 5注入的东西...我当然没有指定它。所以我添加了一条json线来摆脱它。

$("#formCreateEditFinancier").removeAttr("novalidate");

HTML渲染没有它，但我仍然没有客户端验证????

所以最后我想要的是某种形式的验证....我的意思是更糟糕的情况我可以使用一些非常古老的学校json检查字段长度等...但是希望使用更新的方法。< / p>

修改

根据iceburg的建议，我将我的模态窗体javascript修改为：

var validator = $("#formCreateEditFinancier").kendoValidator().data("kendoValidator");

    $("form").submit(function (event)
    {
        event.preventDefault();
        if (validator.validate())
        {
            alert('gtg');
        }
        else
        {
            alert('fail');
        }
    });

现在当我加载表单并点击提交（没有字段完成）时，它会显示警告GTG ....等待它应该失败！

现在查看HTML是否呈现验证装饰。

<input name="FinancialInstitutionName" class="text-box single-line" id="FinancialInstitutionName" type="text" value="" data-val="true" data-val-required="The Financial Named field is required.">
<span class="field-validation-valid" data-valmsg-replace="true" data-valmsg-for="FinancialInstitutionName"></span>

看来“必需”属性没有设置。如果我在F12 Dev Tools中编辑HTML添加所需属性然后点击提交我的验证工作应该......所以看来问题出在我的模型上装饰正在呈现。

解决

因此，在iceburg的指导下，我发现我的DataAnnotations没有正确呈现....实际证明它们是，但我错过了验证器js文件，如下所述：

Data annotations not working in view model

Answer 1

验证通常通过在提交表单时验证表单中的输入字段来起作用。您可以将您的Url操作更改为输入类型提交，它应该可以正常工作。或者在按钮单击处理程序中手动调用kendo验证器.validate（）方法。保留对验证者的引用：

var validator = $("#formCreateEditFinancier").kendoValidator().data("kendoValidator");

然后点击按钮：

if(validator.validate()){
//submit
}
else{
//not valid show errors.
}

见这里： http://demos.telerik.com/kendo-ui/validator/index

至于无验证我相信剑道或mvc正在添加。它告诉浏览器不要使用内置验证的HTML 5。

Kendo Validator未针对MVC局部视图触发

1 个答案: