Html.Client验证不适用于mvc

时间:2011-07-14 14:56:07

标签: asp.net-mvc asp.net-mvc-3 client-side-validation

我正在尝试制定客户端验证并且已经遵循了几个教程,它看起来很简单但我不知道为什么它不能在我的项目上工作,下面是代码:

 <script type="text/javascript" src="/Scripts/jquery-1.4.1.min.js"></script>
 <script type="text/javascript" src="/Scripts/jquery.validate.js"></script>
 <script type="text/javascript" src="/Scripts/MicrosoftMvcJQueryValidation.js"></script>

    <% Html.EnableClientValidation(); %>
    <% using (Html.BeginForm()) {%>
    <%: Html.ValidationSummary("Please Correct the errors and try again")%>

    <div class="editor-label">
            <%: Html.LabelFor(model => model.test,"Test") %>
        </div>
        </td>
        <td>
        <div class="editor-field">
            <%: Html.TextBoxFor(model => model.test)%>
            <%: Html.ValidationMessageFor(model => model.test)%>
        </div>
        </td>
        </tr>

编辑: 母版页

 <script type="text/javascript" src="<%= Url.Content("~/scripts/jquery-1.5.1.js") %>"></script>
    <script type="text/javascript" src="<%= Url.Content("~/scripts/jquery.validate.js") %>"></script>
    <script type="text/javascript" src="<%= Url.Content("~/scripts/jquery.validate.unobtrusive.js") %>"> </script>
    <script src="/Scripts/jquery-ui.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="/Scripts/tiny_mce/jquery.tinymce.js"></script>
    <script src="/Scripts/ie6.js" type="text/javascript"></script>

任何想法当我按下该字段的tab时,为什么客户端验证不起作用。

1 个答案:

答案 0 :(得分:2)

在ASP.NET MVC 3中,jqueryjquery.validate是进行客户端验证的默认框架。所以修改你的代码看起来像这样:

<script type="text/javascript" src="<%= Url.Content("~/scripts/jquery-1.5.1.js") %>"></script>
<script type="text/javascript" src="<%= Url.Content("~/scripts/jquery.validate.js") %>"></script>
<script type="text/javascript" src="<%= Url.Content("~/scripts/jquery.validate.unobtrusive.js") %>"></script>

<% using (Html.BeginForm()) { %>
    <%= Html.ValidationSummary("Please Correct the errors and try again") %>

    <div class="editor-label">
        <%= Html.LabelFor(model => model.test, "Test") %>
    </div>
    <div class="editor-field">
        <%= Html.TextBoxFor(model => model.test) %>
        <%= Html.ValidationMessageFor(model => model.test) %>
    </div>
<% } %>

需要注意的事项:

  • 使用jQuery 1.5.1,它是与ASP.NET MVC 3 RTM和Tools Update捆绑在一起的默认版本。确保使用更高版本的jQuery作为IIRC,jquery.validate插件和jquery版本之间存在一些不兼容。
  • 使用jquery.validate.js
  • 使用jquery.validate.unobtrusive.js不显眼地将jQuery.validate插件附加到Html助手发出的HTML5 data- *属性。
  • 使用Url.Content帮助程序引用静态资源,而不是对其位置进行硬编码。
  • 不再需要致电Html.EnableClientValidation()
  • 不再需要包含任何以前缀Microsoft*
  • 开头的JavaScript

最后一点说明:确保在您的web.config中启用了不显眼的客户端脚本验证:

<appSettings>
    ...
    <add key="ClientValidationEnabled" value="true" />
</appSettings>

获取这些脚本的最新版本的最佳方法是安装ASP.NET MVC 3 Tools Update,使用Visual Studio中的默认向导创建一个新的ASP.NET MVC 3项目并获取这3个脚本。