Question

我有ViewModel的视图。

它有一个回复完全不同的模型的表单。

我尝试让客户端验证工作。

我有

<script type="text/javascript" src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")"></script>
    <script type="text/javascript" src="@Url.Content("~/Scripts/jquery.validate.min.js")"></script>
    <script type="text/javascript" src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")"></script>

<add key="ClientValidationEnabled" value="true" />
<add key="UnobtrusiveJavaScriptEnabled" value="true" />

我的观点如下：

<form method="post" action="@Url.Action("Checkout")">
    @Html.ValidationSummary()
    <table>
        <tr>
            <td>Forename:</td>
            <td>@Html.TextBox("Forename")  @Html.ValidationMessage("Forename","*")</td>
        </tr>
</table>
</form>

我得到的结论是客户端验证基于输入上的ViewModel创建HTML5属性，但我没有ViewModel来创建数据属性，所以客户端验证如何工作？

Answer 1

客户端验证开箱即用的方式是它使用传递给视图的视图模型的ModelMetadata，根据您在视图上使用的Data Annotation属性在输入字段上发出HTML5 data-*属性模型。如果在POST操作中使用完全不同的视图模型作为操作参数，这显然不起作用，因为服务器端验证将依赖于POST操作中的视图模型，而客户端验证将依赖于传递给视图渲染的视图模型这个表格。

我能看到这个问题的唯一解决方案是忘记自动客户端验证并手动定义jquery.validate规则，以便它们与您在服务器上的POST操作中使用的视图模型保持一致。因此，您基本上可以忘记data-*属性，从页面中排除jquery.validate.unobtrusive.min.js脚本并get into coding：

$(function() {
    $('form').vaildate({
        rules: {
            ...
        },
        messages: {
            ...
        }
    });
});

对InputModel而不是ViewModel的MVC客户端验证

1 个答案: