Validation (chứng thực) là một tính năng quan trọng trong ASP.NET MVC và được phát triển trong một thời gian dài. Validation vắng mặt trong phiên bản đầu tiên của asp.net mvc và thật khó để tích hợp 1 framework validation của một bên thứ 3 vì không có khả năng mở rộng. ASP.NET MVC2 đã hỗ trợ framework validation do Microsoft phát triển, tên là Data Annotations. Và trong phiên bản 3, framework validation đã hỗ trợ tốt hơn việc xác thực phía máy khách, và đây là một xu hướng của việc phát triển ứng dụng web ngày nay.
Kiểm tra dữ liệu luôn là 1 thách thức đối với một lập trình viên. Bạn không chỉ kiểm tra dữ liệu ở trình duyệt mà còn phải kiểm tra dữ liệu (bao gồm cả phần logic) trên server. Việc kiểm tra ở phía client sẽ mang lại những thông tin cần thiết khi người dùng nhập dữ liệu trên form và việc kiểm tra trên server là 1 điều hết sức cần thiết, vì đây là nơi nhận bất kỳ thông tin từ 1 mạng nào đó.
Ngoài ra, các thuộc tính trong Data Annotations còn dùng để điều khiển việc hiển thị dữ liệu (ví dụ như DisplayName, DataType…)
Các attribute dùng để Validation:
Attribute Remote: chỉ ra tên Controller và Action thực hiện việc kiểm tra dữ liệu bằng Ajax.
Download ví dụ: MediaFire
Tầm quan trọng của Validation
Giả sử nếu bạn làm một website và không kiểm tra việc nhập dữ liệu của user, chuyện gì xảy ra nếu một đoạn mã độc được gởi lên server.Kiểm tra dữ liệu luôn là 1 thách thức đối với một lập trình viên. Bạn không chỉ kiểm tra dữ liệu ở trình duyệt mà còn phải kiểm tra dữ liệu (bao gồm cả phần logic) trên server. Việc kiểm tra ở phía client sẽ mang lại những thông tin cần thiết khi người dùng nhập dữ liệu trên form và việc kiểm tra trên server là 1 điều hết sức cần thiết, vì đây là nơi nhận bất kỳ thông tin từ 1 mạng nào đó.
ServerSide Validation
Việc kiểm tra thông tin trên server nên hoàn thành dù có kiểm tra dữ liệu ở client hay không. Người dùng có thể vô hiệu hóa Javascript hoặc làm 1 cách nào đó để vượt qua sự kiểm tra dữ liệu ở client, và server là nơi phòng vệ cuối cùng trước những dữ liệu không mong muốn. Một vài quy tắc kiểm tra đòi hỏi chỉ được thực hiện ở server, vì đây là nơi tiếp cận nguồn dữ liệu an toàn hơn so với việc tiếp cận từ trình duyệt.Validation với Data Annotations
Data Annotations được giới thiệu trong phiên bản .NET 3.5, là 1 bộ tập hợp các thuộc tính và các class được định nghĩa trong System.ComponentModel.DataAnnotations, dùng để bổ sung thông tin cho class với metadata. MetaData gồm 1 bộ các quy tắc được dùng để chỉ ra đối tượng nào cần được kiểm tra.Ngoài ra, các thuộc tính trong Data Annotations còn dùng để điều khiển việc hiển thị dữ liệu (ví dụ như DisplayName, DataType…)
Các attribute dùng để Validation:
- CompareAttribute: So sánh 2 giá trị của 2 thuộc tính trong Model. Nếu bằng nhau, trả về true.
- RemoteAttribute: Dựa trên JQuery Validation, dùng để gọi hàm trên Server thực hiện việc kiểm tra
- RequiredAttribute: Dữ liệu không được phép rỗng.
- RangeAttribute: Dữ liệu là số, được nhập vào thuộc phạm vi được chỉ ra
- RegularExpressionAttribute: Dữ liệu được nhập vào được so sánh hợp lệ với biểu thức được chỉ ra.
- StringLengthAttribute: Chỉ ra số ký tự được phép nhập vào.
- …
Client Side Validation
Để việc kiểm tra dữ liệu thực hiện phía client, bạn cần thiết lập thuộc tính true cho 2 thuộc tính:<add key="ClientValidationEnabled" value="true">
<add key="UnobtrusiveJavaScriptEnabled" value="true">
Ngoài ra bạn phải nhúng thêm thư viện JQuery:
<script src="@Url.Content("~/Scripts/jquery.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
Ví dụ
Thiết kế Model: Ngoài việc mô tả các thuộc tính (properties), bạn phải thêm vào các attribute để thực hiện việc kiểm tra dữ liệu.
public class Person
{
[Required]
[StringLength(160)]
public string FirstName { get; set; }
[Required(ErrorMessage="Your lastname is required")]
public string LastName {get; set; }
[Range(1, 150)]
public string Age { get; set; }
[RegularExpression(@"[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}")]
public string Email { get; set; }
[Compare("Email")]
public string EmailConfirm { get; set; }
[Remote("CheckUserName", "Account")]
public string UserName { get; set; }
}
Attribute Compare: Bạn chỉ ra tên property cần so sánh giá trị.Attribute Remote: chỉ ra tên Controller và Action thực hiện việc kiểm tra dữ liệu bằng Ajax.
public class AccountController : Controller
{
//
// GET: /Account/
public JsonResult CheckUserName(string username)
{
if (username == "anbinhtrong")
return Json(false, JsonRequestBehavior.AllowGet);
return Json(true, JsonRequestBehavior.AllowGet);
}
}
Thực hiện đoạn code hiển thị dữ liệu ở View:
@using(Html.BeginForm())
{
@Html.ValidationSummary(true)
<fieldset>
<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.FirstName):</div>
<div class="editor-field">
@Html.TextBoxFor(m => m.FirstName)
@Html.ValidationMessageFor(m => m.FirstName)
</div>
<div class="editor-label">@Html.LabelFor(m => m.LastName):</div>
<div class="editor-field">
@Html.TextBoxFor(m => m.LastName)
@Html.ValidationMessageFor(m => m.LastName)
</div>
<div class="editor-label">@Html.LabelFor(m => m.Age):</div>
<div class="editor-field">
@Html.TextBoxFor(m => m.Age)
@Html.ValidationMessageFor(m => m.Age)
</div>
<div class="editor-label">@Html.LabelFor(m => m.Email):</div>
<div class="editor-field">
@Html.TextBoxFor(m => m.Email)
@Html.ValidationMessageFor(m => m.Email)
</div>
<div class="editor-label">@Html.LabelFor(m => m.EmailConfirm):</div>
<div class="editor-field">
@Html.TextBoxFor(m => m.EmailConfirm)
@Html.ValidationMessageFor(m => m.EmailConfirm)
</div>
<input type="submit" value="Ok"/>
<input type="reset" value="Làm lại"/>
</fieldset>
}
ValidationMessageFor: Hiển thị thông báo khi dữ liệu bị lỗi ở ô tương ứng.
Kiểm tra dữ liệu phía Server:
[HttpPost]
public ActionResult Index(Person person,FormCollection form)
{
if (ModelState.IsValid)
{
//Do something
}
return View("Index");
}
ModelState.IsValid: mang giá trị false khi 1 thuộc tính nào đó mang giá trị không hợp lệ.Kết luận
Việc kiểm tra dữ liệu tương đối được đơn giản hóa nhờ sự hỗ trợ của thư viện Data Annotations. Nhưng đôi khi chúng ta gặp phải những tình huống phức tạp, vượt ra ngoài khả năng hỗ trợ của asp.net mvc, lúc đó chúng ta cần quay lại tìm hiểu jquery validation và tự viết riêng cho phần kiểm tra đó.Download ví dụ: MediaFire
Nhatkyhoctap' blog
Hay, chi tiết thanks anh
Trả lờiXóaHay, chi tiết thanks anh
Trả lờiXóaHtml 5 validation: https://webdesign.tutsplus.com/vi/tutorials/html5-form-validation-with-the-pattern-attribute--cms-25145
Trả lờiXóahttps://topdev.vn/blog/validate-form-voi-html5/#customize-cu-hin-th-li
Trả lờiXóa