我正在为我正在开发的许多网站使用 jQuery 模板，并且已经达到了我需要决定如何在客户端实现验证的程度。 Serverside 是一个 Asp.Net Mvc Restful 服务，处理各种模型。这些模型用 DataAnnotations 装饰来描述验证。下面是一个示例(请注意，我们使用资源文件作为错误副本):
[Required(
ErrorMessageResourceType = typeof(Validation),
ErrorMessageResourceName = "HomeAddressRequired")]
[StringLength(250,
ErrorMessageResourceType = typeof(Validation),
ErrorMessageResourceName = "HomeAddressStringLength")]
public string Address { get; set; }
以前，我只使用 Razor(或旧的 Asp.Net View 引擎，直到我们切换到 Mvc 3)，它处理生成 jquery.validate.js Hook 所需的所有客户端装饰。现在我正在使用 jQuery 模板，这不太可行。
我在这里看到三个选项:
修改模板以手动包含验证和错误副本。这很糟糕，因为我将被迫分别维护客户端和服务器端验证；它有点扼杀了 DataAnnotations 的整个想法。
利用 Razor 和 Mvc 3 的低调 JavaScript 方法来帮助我呈现模板。更好，因为它为我重现了验证，但性能受到影响。也意味着我正在使用服务器端模板引擎...来渲染模板。我可以通过输出缓存最大限度地减少性能损失。
仅依靠远程验证来返回我的模型的模型状态，并为 jQuery Validate 编写我自己的适配器，以处理正确元素的路由错误。这个可以避免使用 Razor，但会终止纯粹的客户端验证，意味着我必须编写一个复杂的插件。
理想情况下，当我们部署这个东西时，我应该能够将模板作为静态文件提供给客户端，而无需任何直接的后端依赖。
那么，对于我的问题:利用 jQuery 模板客户端和模型服务器端的 DataAnnotations，在不重复自己的情况下处理验证的最有效方法是什么？
最佳答案
我选择2)
错误模板可以位于客户端。对性能不友好的服务器端代码是为 jQuery.validation 设置规则的代码。但这确实无法避免，因为您的规则是在 .NET 模型中定义的。
我今天遇到了类似的问题，但是对于样式，我不太喜欢 jQuery.validation 如何为您制作标签。我想用 jQuery 模板覆盖输出。我还希望我的输出位于表格的另一个单元格中。
显然，您可以覆盖插件中的 validator.prototype.showLabel 函数。现在，您可以完全控制在出现问题时显示的位置以及显示的内容。
这是一个例子:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title></title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.js"></script>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.min.js"></script>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.js"></script>
<script type="text/javascript">
$.extend($.validator.prototype, {
showLabel: function (element, message) {
$(element).siblings('.validationLabel').remove();
$('#tmplValidationLabel').tmpl({ Message: message }).insertAfter($(element));
}
});
</script>
</head>
<body>
<form>
<div><input type="text" name="Email" /></div>
<div><input type="text" name="SomeName" /></div>
<input type="submit" value="Submit" />
</form>
<script type="x-jquery-tmpl" id="tmplValidationLabel">
<span class="validationLabel">
<b>${Message}</b> <span> :( </span>
</span>
</script>
<script type="text/javascript">
$(function () {
$('form').validate({
rules: {
Email: { required: true, email: true },
SomeName: "required"
},
messages: {
Email: { required: "Enter Email", email: "Not an email" },
SomeName: "Enter something man!"
}
});
});
</script>
</body>
</html>
希望对你有帮助
气
关于使用 jQuery.Templates 场景进行 jQuery 验证，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/5020193/