在Asp.net MVC 中，View中我们仍然需要对提交的表单进行验证。通常验证分为客户端验证，服务端验证。
客户端验证，我们可以使用JQuery validation plugin，服务端验证，除了使用ModelState属性显示错误信息到
View，还可以使用Fluent Validation for .NET，一个小巧的.net验证框架，使用fluent的接口和lambda表达式对
你的业务对象构建验证规则。而且也有对应的MVC扩展。
我们首先增加一个验证UserEntity的验证类：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using DemoMVCForm.Models;
using FluentValidation;
using FluentValidation.Validators;

namespace DemoMVCForm.
{
    /// 
    /// UserValidation
    /// 
    /// Author : PetterLiu 2009-02-1515:54  http://wintersun.cnblogs.com 
    public class UserValidation : AbstractValidator<UserEntity>
    {
        /// 
        /// Initializes a new instance of the  class.
        /// 
        /// Author : PetterLiu 2009-02-1515:54  http://wintersun.cnblogs.com 
        public UserValidation()
        {
            RuleFor(u => u.UserName).NotEmpty();
            RuleFor(u => u.UserName).Length(5, 16);
            RuleFor(u => u.Password).NotEmpty().WithMessage("必须输入密码");
            RuleFor(u => u.Email).NotEmpty();
            RuleFor(u => u.Email).EmailAddress();
            RuleFor(u => u.Url).Url();
            RuleFor(u => u.PassportID).NotEmpty();
        }
    }

    /// 
    ///  UrlValidationRule
    /// 
    /// T
    /// Author : PetterLiu 2009-02-1515:54  http://wintersun.cnblogs.com 
    public class UrlValidationRule : RegularExpressionValidator
    {
        /// 
        /// Initializes a new instance of the  class.
        /// 
        /// Author : PetterLiu 2009-02-1515:54  http://wintersun.cnblogs.com 
        public UrlValidationRule()
            : base(@"^http\://[a-zA-Z0-9\-\.]+\.[a-zA-Z]{2,3}(/\S*)?$")
        {

        }
    }

    /// 
    /// UrlValidationExtension
    /// 
    /// Author : PetterLiu 2009-02-1515:54  http://wintersun.cnblogs.com 
    public static class UrlValidationExtension
    {
        public static IRuleBuilderOptionsstring> Url(this IRuleBuilderstring> ruleBuilder)
        {
            return ruleBuilder.SetValidator(new UrlValidationRule());
        }
    }
}


看上增加了服务端验证规则多么简单的代码，比较直观。后又增加一个验证URL的规则，用于验证输入的URL。
接着来看，如何使用它：

/// 
/// Registers the specified user.
/// 
/// The user.
/// 
/// Author : PetterLiu 2009-02-1515:56  http://wintersun.cnblogs.com 
public JsonResult Register(UserEntity user)
{
    UserValidation userValidation = new UserValidation();
    ValidationResult validationResult = userValidation.Validate(user);

    //add error state information to ModelState.
    validationResult.AddToModelState(ModelState, "user");

    bool validationSucceeded = validationResult.IsValid;
    IList<ValidationFailure> failures = validationResult.Errors;
   
    //return result for json format.
    return Json(failures);
}

通过扩展的AddToModelState方法，能让验证的错误信息返回VIEW，但实际上如果没有使用Html.ValidationMessage，
也不需要这个方法了。看实际情况选择了。最后把验证后的结果对象：ValidationFarilure通过Json格式返回。
好，来看VIEW：

DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Demotitle>
    <style. type="text/css">
        #inputArea
        {
            font-family: Arial, Sans-Serif;
        }
        #inputArea input, #inputArea textarea
        {
            font-family: Arial, Sans-Serif;
            margin-bottom: 5px;
            padding: 1px;
            border: solid 1px #85b1de;
        }
    style>
    <link href="http://www.cnblogs.com/Content/Site.css" rel="stylesheet" type="text/css" />

    <script. src="http://www.cnblogs.com/Scripts/jquery-1.3.1.js" type="text/javascript">script>

    <script. src="http://www.cnblogs.com/Scripts/jquery.validate.js" type="text/javascript">script>

    <script. src="http://www.cnblogs.com/Scripts/jquery.form.js" type="text/javascript">script>

    <script. type="text/javascript">
        $(document).ready(function() {
            function ProcessJson(data) {
                var ret = "服务器返回验证结果:\n"
                for (key in data) {
                    ret += data[key].ErrorMessage;
                    ret += "\n";
                }
                alert(ret);
            }
            jQuery.validator.addMethod("usernamecheck", function(value, element) {
                return this.optional(element) || /^[a-zA-Z][a-zA-Z0-9_]{4,15}$/.test(value);
            }, "5-16位字母开头，允许字母数字下划线")

            jQuery.validator.addMethod("ppIdcheck", function(value, element) {
                return this.optional(element) || /^[1-9]([0-9]{14}|[0-9]{17})$/.test(value);
            }, "请输入正确的身份证号码(15-18位)")

            $("#form-sign-up").validate({
                rules: {
                    password: {required: true,usernamecheck: ""},
                    confirm_password: {required: true,minlength: 8,equalTo: "#password"},
                    username: {
                        required: true,
                        remote: '<%=Url.Action("IsLoginAvailable", "FormDemo") %>'
                    },
                    passportId:
                    {
                        required: true,
                        ppIdcheck: ""
                    }
                },
                messages: {
                        confirm_password: {
                        required: "请填写一个密码",
                        minLength: "长度必须8个字符",
                        equalTo: "请输入与上面相同的密码"
                    },
                    username: {
                        required: "请输入用户名",
                        remote: jQuery.format("{0} 已经有人用了")
                    },
                    checkbox11:
                    {
                        required: "请打勾"
                    }

                },
                // set this class to error-labels to indicate valid fields 
                success: function(label) {
                    // set   as text for IE 
                    label.html(" ").addClass("checked");
                },
                submitHandler: function(form) {
                    var formoption = {
                        dataType: "json",
                        url: '<%=Url.Action("Register", "FormDemo")%>',
                        type: "post",
                        success: ProcessJson  // post-submit callback 
                    };
                    $(form).ajaxSubmit(formoption);

                } 
            });
        });
    script>

head>
<body>
    <form. method="post" id="form-sign-up">
    <h1>
        Demo表单h1>
    <table id="inputArea">
        <tr>
            <td>
                用户名 (试试输入 Petter):
            td>
            <td>
                <input type="text" name="username" id="username" />
            td>
        tr>
        <tr>
            <td>
                Email:
            td>
            <td>
                <input type="text" name="email" id="email" class="required email" />
            td>
        tr>
        <tr>
            <td>
                Url:
            td>
            <td>
                <input type="text" name="url" id="url" class="required url" />
            td>
        tr>
        <tr>
            <td>
                密码:
            td>
            <td>
                <input type="password" name="password" id="password" />
            td>
        tr>
        <tr>
            <td>
                确认密码:
            td>
            <td>
                <input type="password" name="confirm_password" id="confirm_password" />
            td>
        tr>
        <tr>
            <td>
                记住密码
            td>
            <td>
                <input type="checkbox" name="checkbox11" id="checkbox" class="required" />
            td>
        tr>
        <tr>
            <td>
                <label for="passportId">
                    身份证号label>
                <em>*em>
            td>
            <td>
                <input type="text" name="passportId" id="passportId" class="required" />
            td>
        tr>
        <tr>
            <td colspan="2" align="center">
                <br />
                <input type="submit" id="btn1" value="提交" />
            td>
        tr>
    table>
    form>
body>
html>


View中使用是Jquery Validation，同样是增加rule,用于客户端验证。具体可参考官方文档(后续有时间会放出中文版文档)，以及之前这篇文章
《JQuery+Asp.net MVC实现用户名重名查询》

小结：在WEB页面中，是一个数据进入的接口，对数据合法性，正确性非常重要。做好表单数据验证工作可以防止那些攻击数据，以及不合理数据。
通过使用客户端和服务端双重验证，可以保证表单数据安全性。有的时候客户端验证并不是太安全的，可以设法绕开验证提交表单。所以服务端验证
也是需要的。但为了减轻服务器压力，尽量使用客户端验证。以上只是一个小小例子，欢迎讨论。希望本文对您有帮助。

ITPub博客

Asp.net MVC中表单验证

最新文章