在我们目前的添加书籍视图与编辑书籍视图中还有个问题:没有对提交的数据进行任何有效性验证。用户可以在该视图的文本框中不填入任何内容而直接将数据提交到后台,或者在单价文本框中填入任何文字内容。
在ASP.NET MVC3中,我们可以通过对模型类添加注解的方法来添加数据验证。我们可以在数据注解中描述对于模型类中各属性的验证规则,ASP.NET MVC3自身会根据这些注解进行数据验证,并且向用户显示验证错误信息。
6.1 在书籍表单中增加验证
我们将要使用到如下这几种数据注解:
-
Required—标识该属性值中必须填入内容。
-
DisplayName—标识该属性的标签与验证错误信息中的显示文字。
-
StringLength—标识该属性所用文本框中最大允许输入的文字长度。
-
Range—标识数值类型文本框中允许输入的数字范围。
-
Bind—标识在将参数或表单值绑定到模型中的各属性时包括(include)或不包括(exclude)哪些属性。
-
ScaffoldColumn—是否在表单中显示属性用输入控件。
更多使用数据注解进行验证的说明参见http://msdn.microsoft.com/en-us/library/ee256141(VS.100).aspx
打开Book(书籍)类文件,在文件头部追加如下所示using语句。
using System.ComponentModel;
using System.ComponentModel.DataAnnotations;
using System.Web.Mvc;
接下来,修改该类的各属性,添加如下所示的各种数据注解。
namespace MvcBookStore.Models
{
[Bind(Exclude = "Id")]
public class Book
{
[ScaffoldColumn(false)]
public int Id { get; set; }
[DisplayName("书籍种类")]
public int GenreId { get; set; }
[DisplayName("作者")]
public int AuthorId { get; set; }
[Required(ErrorMessage = "必须输入书名")]
[StringLength(10)]
[DisplayName("书名")]
public string Title { get; set; }
[Required(ErrorMessage = "必须输入单价")]
[Range(0.01, 100.00,ErrorMessage = "单价必须在1元到100元之间")]
[DisplayName("单价")]
public decimal Price { get; set; }
public virtual Genre Genre { get; set; }
public virtual Author Author { get; set; }
}
}
将前面介绍的编辑模板(Views文件夹下的Shared文件夹下的EditorTemplates文件夹中book.cshtml文件)中的代码修改为如代码清单6-1中所示的代码。
代码清单6-1 书籍编辑模板
@model MvcBookStore.Models.Book
<div class="editor-label">
@Html.LabelFor(model =>model.GenreId)
</div>
<div class="editor-field">
@Html.DropDownList("GenreId",new SelectList(ViewBag.Genres as
System.Collections.IEnumerable,"GenreId", "Name", Model.GenreId))
</div>
<div class="editor-label">
@Html.LabelFor(model =>model.AuthorId)
</div>
<div class="editor-field">
@Html.DropDownList("AuthorId",new SelectList(ViewBag.Authors as
System.Collections.IEnumerable,"AuthorId", "Name", Model.AuthorId))
</div>
<div class="editor-label">
@Html.LabelFor(model =>model.Title)
</div>
<div class="editor-field">
@Html.EditorFor(model =>model.Title)
@Html.ValidationMessageFor(model=> model.Title)
</div>
<div class="editor-label">
@Html.LabelFor(model =>model.Price)
</div>
<div class="editor-field">
@Html.EditorFor(model =>model.Price)
@Html.ValidationMessageFor(model=> model.Price)
</div>
运行应用程序,访问“/StoreManager/Create”这个URL地址,页面显示如图6-1所示。
图6-1 使用数据注解后的添加书籍视图
直接点击保存按钮,我们将看见表单中会显示各种验证错误信息,如图6-2所示。
图6-2 错误信息的显示
6.2 测试客户端验证
在一个网站或Web应用程序中,服务器端是非常重要的,因为用户可以想办法避开客户端验证。但是,如果只在服务器端实现验证的话,会存在如下几个问题。
1.用户必须在提交再返回之后才能看见输入错误,即使是最简单的错误。
2.用户修改了该错误输入后也不能立刻看见输入是否正确。
3.为了在服务器端实行验证而浪费服务器端的资源,影响服务器端的性能。
幸运的是,ASP.NET MVC3的支架模板中内置了客户端验证,不需要额外进行任何设置。在书名文本框中输入一个文字,该书名文本框旁的错误信息提示立刻就消失了,如图6-3所示。
图6-3 在客户端实现验证