MVC 验证和异常处理 客户端验证

一般处理

Asp.net mvc 可以依据model的 metadata 使用ModelValidator对象生产客户端验证脚本。使用方法为包括以下步骤:

A,model使用Data  Annotation attribute,

B,然后在view上加一行:

<% Html.EnableClientValidation(); %>注意语法格式,该方法返回的是void,所以用<%   %>而不是<%:   %>。

C,引用js脚本

<script type="text/javascript" 

        src="<%: Url.Content("~/Scripts/MicrosoftAjax.js") %>"></script>

<script type="text/javascript" 

        src="<%: Url.Content("~/Scripts/MicrosoftMvcValidation.js") %>"></script>

D,view

 <script type="text/javascript" 
        src="<%: Url.Content("~/Scripts/MicrosoftAjax.js") %>"></script>
    <script type="text/javascript" 
        src="<%: Url.Content("~/Scripts/MicrosoftMvcValidation.js") %>"></script>
    <h2>登录</h2>
    <p>
        请输入用户名和密码。 <%: Html.ActionLink("注册", "Register") %> 如果您没有帐户。
    </p>
    <% Html.EnableClientValidation(); %>
    <% using (Html.BeginForm()) { %>
        <%: Html.ValidationSummary(true, "登录不成功。请更正错误并重试。") %>
        <div>
            <fieldset>
                <legend>帐户信息</legend>
               
                <div class="editor-label">
                    <%: Html.LabelFor(m => m.UserName) %>
                </div>
                <div class="editor-field">
                    <%: Html.TextBoxFor(m => m.UserName) %>
                    <%: Html.ValidationMessageFor(m => m.UserName) %>
                </div>
               
                <div class="editor-label">
                    <%: Html.LabelFor(m => m.Password) %>
                </div>
                <div class="editor-field">
                    <%: Html.PasswordFor(m => m.Password) %>
                    <%: Html.ValidationMessageFor(m => m.Password) %>
                </div>
               
                <div class="editor-label">
                    <%: Html.CheckBoxFor(m => m.RememberMe) %>
                    <%: Html.LabelFor(m => m.RememberMe) %>
                </div>
               
                <p>
                    <input type="submit" value="登录" />
                </p>
            </fieldset>
        </div>
    <% } %>

自定义错误提示样式

默认class名称为input-validation-valid,所以,可以用就近原则,覆盖默认样式。比如在希望高亮,则可以在css文件或则view加入样式:.input-validation-valid { border: 1px solid green; background-color: #CCFFCC; }

取消submit引发客户端验证。

默认,一旦页面某个元素激发submit,则跟着引发验证,如果因为一些特殊要求,不想某个按钮什么的在提交时验证,可以这么做:

<input id="submitBooking" type="submit" value="Place booking" />

then the following JavaScript allows it to bypass client-side validation:

<script type="text/javascript">

    document.getElementById("submitBooking").disableValidation = true;

</script>

posted on 2011-03-05 17:10  arg  阅读(1039)  评论(5编辑  收藏  举报

导航