（.NET进阶七）Form验证/特性分析/模型验证/HtmlHelper

最新推荐文章于 2023-10-03 08:16:04 发布

Tiger_shl

最新推荐文章于 2023-10-03 08:16:04 发布

阅读量289

点赞数

分类专栏：学习笔记

本文链接：https://blog.csdn.net/Tiger_shl/article/details/90454140

版权

学习笔记专栏收录该内容

16 篇文章 3 订阅

订阅专栏

一、MVC中的验证功能

二、视图助手-HtmlHelper

三、验证码的生成

一、MVC中的验证功能

基于MVC的表单验证

实现步骤: 定义验证规则 -> 应用验证规则 -> 显示验证信息

使用特性定义验证规则

支持对模型应用验证规则
位于System.ComponentModel.DataAnnotations命名空间

都继承自ValidationAttribute类,该类的一个基本属性ErrorMessage用来定义消息属性

验证特性	功能
Required	必须验证
Compare	比较验证:验证两个值是否一致
StringLength	字符串的长度验证(可以单独设置最大长度,也可以同时设置最小长度)
Range	用于数字(整型和浮点型)、时间等类型的数据范围验证
RegularExpression	正则表达式验证

特性验证的使用

using System.ComponentModel;
using System.ComponentModel.DataAnnotations;
using System.Web.MVC;

//写在实体类中
public class Customer
{
    [Required(ErrorMessage = "{0}不可为空")]//必填验证
    public string LoginId{get;set;}
    
    [Required(EooroMessage="{0}不可为空")]
    [StringLength(18,MinimumLength=6,ErrorMessage="{0}长度必须在{2}和{1}之间")]//长度验证
    public string LoginPwd{get;set;}
    
    
    [Required(EooroMessage="{0}不可为空")]
    [Compare("LoginPwd",ErrorMessage="两次输入的密码必须一致")]//比较验证
    public string PasswordConfirm{get;set;}
    
    [Range(18,60,ErrorMessage="{0}必须在{1}和{2}之间")]//范围验证,可以是整数/浮点数
    public int Age{get;set;}    

    [DisplayName["年龄"]]
    [Required(EooroMessage="{0}不可为空")]
    [Range(18,60,ErrorMessage="{0}必须在{1}和{2}之间")]//范围验证,可以是整数/浮点数
    public int? Age{get;set;}  

    public string Name{get;set;}

    [DisplayName["电子邮箱"]]
    [Required(EooroMessage="{0}不可为空")]
    [RegularExpression(@"^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$",ErrorMessage="请输入正确的{0}")]//正则表达式验证
    public string Email{get;set;}

}

认识ModelState对象

表单与模型验证的关系
1. 在模型类中定义验证规则后，ASP.NET MVC在将数据映射到模型时，会自动应用模型类上的验证规则
2. 验证过程中，会自动把验证错误信息添加到ModelState数据字典中

常用成员

成员	功能
IsValid	判断模型上所有验证是否通过
AddModelError(key,value)	添加自定义的错误信息

//控制器内容
public ActionResult Register(Customer customer)
{
    if(ModelState.IsValid)//判断验证是否通过
    {
        CustomerManager cus = new CustomerManager();
        if(!cus.Register(customer))
        {
             ModelState.AddModelError("doubleUser","用户名已存在!");
             return View("Regist");
        }
        else
        {
            return Content("<script>alter('注册成功');window.location="+Url.Content("~/")+"<script>")
        }
    }
    else
    {
        return View("Regist");
    } 
}

视图中验证信息的展

在视图中输出验证信

方法1:理论上可以使用ModelState对象来输出验证信息,但是比较繁琐

方法2:实际中,使用HTML对象中的两个帮助方法来输出验证信息

<form action = "/Customer/Register" method= "post">
    <p>
        <label><span>*</span>&#160;&#160;用户名</label><input name="LoginId" type="text">
        @Html.ValidationMessage("LoginId")@Html.ValidationMessage("doubleUser")
    </p>
        ......
</form>




MvcHtmlString ValidationMessage(string modelName)//显示指定字段的验证信息

MvcHtmlString ValidationSummary();//显示所有字段验证信息

解决表单数据保存

控制器添加模型输出,并给表单内容添加Value属性(两个步骤,视图加value属性,控制器返回模型)

<form action = "/Customer/Register" method= "post">
    <p>
        <label><span>*</span>&#160;&#160;用户名</label><input name="LoginId" type="text" value="@(Model!=null?Model.Login:"")">
        @Html.ValidationMessage("LoginId")@Html.ValidationMessage("doubleUser")
    </p>
        ......
</form>




public ActionResult Register(Customer customer)
{
    if(ModelState.IsValid)//判断验证是否通过
    {
        CustomerManager cus = new CustomerManager();
        if(!cus.Register(customer))
        {
             ModelState.AddModelError("doubleUser","用户名已存在!");
             return View("Regist",customer);
        }
        else
        {
            return Content("<script>alter('注册成功');window.location="+Url.Content("~/")+"<script>")
        }
    }
    else
    {
        return View("Regist",customer);//返回时一定带着模型,不然表单数据会丢失
    } 
}

二、视图助手-HtmlHelper

认识HtmlHelper
1. HtmlHelper-辅助视图生成表单元素工具
2. 优势
  1. 避免输错表单元素(提高开发效率)
  2. 保持表单数据状态(更简单的表单数据保持方法)
  3. 支持验证
常见输出表单方法

使用HtmlHelper生成表单

<form action = "/Customer/Register" method= "post">
    <p>
        <label><span>*</span>&#160;&#160;用户名</label><input name="LoginId" type="text" value="@(Model!=null?Model.LoginId:"")">
        @Html.ValidationMessage("LoginId")@Html.ValidationMessage("doubleUser")
    </p>
        ......
</form>

                                    |
                                    |
                                    ↓

@using(Html.BeginForm("Register","Customer"))
{
    <p>
        <label><span>*</span>&#160;&#160;用户名</label>
        @Html.TextBox("LoginId")
        @Html.ValidationMessage("LoginId")@Html.ValidationMessage("doubleUser")
    </p>
        ......
}




public ActionResult Register(Customer customer)
{
    if(ModelState.IsValid)//判断验证是否通过
    {
        CustomerManager cus = new CustomerManager();
        if(!cus.Register(customer))
        {
             ModelState.AddModelError("doubleUser","用户名已存在!");
             return View("Regist");
        }
        else
        {
            return Content("<script>alter('注册成功');window.location="+Url.Content("~/")+"<script>")
        }
    }
    else
    {
        return View("Regist");//返回时无需携带模型
    } 
}

Html辅助方法其实不是直接从ViewBag的Model对象获取模型数据，而是从ModelState对象获取，如果使用Model自动绑定，并使用HTML辅助方法，为了让表单保持界面提交的值，没必要再向视图回传数据

三、验证码的生成

实现效果:由数字和字符组成,点击即可实现更换

模型实现

修改控制器

public ActionResult Register(Customer customer，string validateCode)
{
    //校验验证码
    if(string.Compare(TempData["ValidateCode"].Tostring(),validateCode,true) != 0)//true表示忽略大小写
    {
        ModelState.AddModelError("ValidateCode","验证码不正确请重新输入！");
        return View("Regist");
    }

    if(ModelState.IsValid)//判断验证是否通过
    {
        
    }
    else
    {
        return View("Regist");//返回时无需携带模型
    } 
}



public ActionResult ValidateCode()
{
    CreateValidateCode obj = new CreateValidateCode();
    string code = obj.CreateRandomCode(5);
    TempData["ValidateCode"] = code;//使用TempData保存数据,因为其默认为session机制
    //返回验证码图片
    return File(obj.CreateValidateGraphic(code),"image/Jpeg");
}


//视图界面
@using(Html.BeginForm("Register","Customer"))
{
    <p>
        <label><span>*</span>&#160;&#160;验证码</label>
        @Html.TextBox("validateCode")
        <img alt="验证码图片" id="ValidateCode" title="看不清?点击换一个" src="@Url.Action("ValidateCode")" onclick="this.src=this.src+'?'"/>
    </p>
        ......
}