asp.net mvc3 如何实例化客户端验证？答案

【问题标题】：How does asp.net mvc3 instantiate client side validation?asp.net mvc3 如何实例化客户端验证？
【发布时间】：2012-06-12 18:30:08
【问题描述】：

这个问题与 asp.net mvc3 框架关系最密切。它开始于“如何确保使用 jQuery 和 asp.net mvc3 对动态附加的输入字段进行主动验证？”然而，经过一番搜索、测试和咖啡，我发现了这个：

function reValidate(formId) {
 $("#" + formId).removeData("validator");
 $("#" + formId).removeData("unobtrusiveValidation");
 $.validator.unobtrusive.parse("#" + formId);
}

这很好用。但是，我对框架实际使用的机制更好奇。我有一个完全基于脚本生成的页面。视图中唯一的内容是一个<div>，一个用于加载我的库的<script> 标记，以及另一个用于填充<div> 的<script>。渲染一个完全动态的页面后，验证完美无缺。但是，如果在页面加载后使用页面加载时使用的相同过程来包含一些新内容，则验证会中断。当然，只需致电reValidate()。

但是-

a) 页面加载后（或加载时），框架如何实例化验证？

b) 框架的哪个部分处理它？是 mvc3 部分、asp.net 部分、razor 引擎还是其他部分？

【问题讨论】：

标签： jquery asp.net-mvc-3 validation

【解决方案1】：

a) 一旦页面有，框架如何实例化验证已加载（或加载时）？

它解析 DOM，在您的输入字段中查找 data-* 属性并添加 jquery.validate rules。 jQuery validate 是一个客户端验证插件，它与 ASP.NET MVC 无关，可以与任何服务器端框架一起使用，甚至可以与纯静态 HTML 一起使用。

b) 框架的哪个部分处理它？是mvc3部分吗？ asp.net 部分，剃须刀引擎，还是其他部分？

这是jquery.validate.unobtrusive.js 脚本。 Html.TextBoxFor 等 ASP.NET MVC 帮助程序只需使用模型元数据，根据您用于模型的数据注释生成具有正确 data-* 属性的输入字段。这些属性包含所有必要的信息，以便生成本机 jquery 验证规则。因此，不显眼的脚本在 ASP.NET MVC 模型元数据和jquery.validate 插件之间建立了粘合剂。完成这项工作的是 $.validator.unobtrusive.parse 函数。这就是为什么在动态修改 DOM 时需要手动调用它的原因 - 您正在添加/删除需要转换为 jquery 验证规则的 data-* 属性。不要犹豫，看看它是如何在jquery.validate.unobtrusive.js 内部实现的。

【讨论】：

感谢您一如既往的高质量回答。我对此感到好奇的原因之一是下拉列表的验证消息不一致。选择选项时，该消息不会消失。通过查看unobtrusive.js 文件，我能够找到$(selector).valid()，它将重新评估输入并能够将其合并到我的解决方案中。再次感谢！
任何与 asp.net mvc 2 主题相关的链接？

【解决方案2】：

它的工作原理如 Darin Dimitrov 在他的回答中所描述的那样，在客户端，在服务器端，mvc 渲染引擎使用为模型提供的元数据（通常是我们放在模型类的属性上的属性）来决定data-* 属性需要哪些数据，以及是否应该渲染它们。
如果您对更精确的答案感兴趣，您可以随时查看source code of mvc 3，以了解 html 辅助方法何时以及如何读取元数据，最终为您创建 html 字符串。

【讨论】：