不显眼的validation不适用于dynamic内容

我有问题试图让不显眼的jQueryvalidation工作与通过AJAX调用dynamic加载的部分视图。

我花了好几天的时间试图让这个代码没有运气的工作。

这是观看：

@model MvcApplication2.Models.test @using (Html.BeginForm()) { @Html.ValidationSummary(true); <div id="res"></div> <input id="submit" type="submit" value="submit" /> } 

部分观点：

 @model MvcApplication2.Models.test @Html.TextAreaFor(m => m.MyProperty); @Html.ValidationMessageFor(m => m.MyProperty); <script type="text/javascript" > $.validator.unobtrusive.parse(document); </script> 

该模型：

  public class test { [Required(ErrorMessage= "required field")] public int MyProperty { get; set; } } 

控制器：

  public ActionResult GetView() { return PartialView("Test"); } 

最后，javascript：

 $(doument).ready(function () { $.ajax({ url: '/test/getview', success: function (res) { $("#res").html(res); $.validator.unobtrusive.parse($("#res")); } }); $("#submit").click(function () { if ($("form").valid()) { alert('valid'); return true; } else { alert('not valid'); return false; } }); 

validation不起作用。 即使我没有填写任何信息，提交事件显示警报（“有效”）。

但是，如果不是dynamic加载视图，我使用@Html.Partial("test", Model)在主视图中呈现局部视图（并且我不执行AJAX调用），那么validation工作就好。

这可能是因为如果我dynamic地加载内容，DOM中不存在控件。 但是我打电话给$.validator.unobtrusive.parse($("#res")); 这应该足以让validation器有关新加载的控件…

谁能帮忙？

Answer 1

如果您尝试parsing已经parsing的表单，它将不会更新

将dynamic元素添加到表单时，您可以做什么

1. 你可以删除表单的validation并重新validation它是这样的：

    var form = $(formSelector) .removeData("validator") /* added by the raw jquery.validate plugin */ .removeData("unobtrusiveValidation"); /* added by the jquery unobtrusive plugin*/ $.validator.unobtrusive.parse(form); 

2. 使用jquery data方法访问表单的unobtrusiveValidation数据：

    $(form).data('unobtrusiveValidation') 

   然后访问规则集合并添加新的元素属性（这有点复杂）。

你也可以看看这篇文章应用不显眼的jqueryvalidationdynamic内容在ASP.Net MVC插件用于添加dynamic元素到窗体。 这个插件使用第二个解决scheme。

Answer 2

除了Nadeem Khedr的回答….

如果您已经将表单加载到您的DOMdynamic然后调用

 jQuery.validator.unobtrusive.parse(form); 

（提到额外的位），然后将使用ajax提交该表单记得打电话

 $(form).valid() 

在提交表单之前返回true或false（并运行实际validation）。

Answer 3

添加到您的_Layout.cshtml

  $(function () { //parsing the unobtrusive attributes when we get content via ajax $(document).ajaxComplete(function () { $.validator.unobtrusive.parse(document); }); }); 

Answer 4

testing这个：

 if ($.validator.unobtrusive != undefined) { $.validator.unobtrusive.parse("form"); } 

Answer 5

令人惊讶的是，当我看到这个问题时，官方的ASP.NET文档仍然没有任何有关不显眼的parse()方法的信息，或者如何在dynamic内容中使用它。 我冒昧地在docs repo（引用@ Nadeem的原始答案）中提出一个问题，并提交一个pull请求来解决它。 此信息现在可在模型validation主题的客户端validation部分中看到。