ASP.NET - MVC - Kiểm tra dữ liệu là gì?

Kiểm tra dữ liệu là gì?

Khi xây dựng ứng dụng, chúng ta nên kiểm tra dữ liệu nhập từ người dùng để hạn chế các sai sót dữ liệu nhập nhằm đảm bảo việc thực hiện xử lý dữ liệu được chính xác theo các yêu cầu nghiệp vụ. Nếu chúng ta viết mã để kiểm tra phải mất nhiều thời gian (sử dụng JavaScript hoặc VBScript). Webform hỗ trợ các validation controls để kiểm tra dữ liệu nhập từ nguời dùng trong các sever controls , mục đích là tránh để người dùng nhập sai hoặc không được bỏ trống các thông tin quan trọng bắt buộc,…
Với phiên bản trước của ASP.Net là ASP thì để khắc phục lỗi đó chúng ta phải thực hiện viết mã JavaScript để bắt lỗi việc đó, còn với ASP.NET đã cung cấp cho ta những điều khiển kiểm tra tính hợp lệ của các điều khiển nhập liệu trên Form.

Trong phần trước, chúng ta đã tạo một View Edit Student. Bây giờ, chúng ta sẽ xác thực dữ liệu trong chế độ Edit, sẽ hiển thị thông báo lỗi khi click vào nút Save, như hình bên dưới nếu Name và Age là để trống.

DataAnnotations

Trong .NET Framework, Data Annotation dùng để thêm phần ý nghĩa mở rộng vào dữ liệu thông qua các thẻ thuộc tính. Tính năng Data Annotation được Microsoft giới thiệu lần đầu ở .NET 3.5 tại namespace System.ComponentModel.DataAnnotations. Namespace này chứa các lớp dùng để định nghĩa thuộc tính mở rộng cho dữ liệu.

Các thuộc tính DataAnnotations namespace System.ComponentModel.DataAnnotations. Bảng sau liệt kê các thuộc tính xác thực DataAnnotations.

Thuộc tính Giải thích
Required Chỉ định thuộc tính phải có dữ liệu nhập vào trước khi submit về server.
StringLength Định nghĩa chiều dài thuộc tính, cho phép đặc tả cả chiều dài tối thiểu và tối đa.
Range Định nghĩa giá trị số tối thiểu và tối đa của một thuộc tính.
RegularExpression Là biểu thức chính quy được dùng để xử lý chuỗi nâng cao thông qua biểu thức riêng của nó
CreditCard Định nghĩa số thẻ tính dụng (credit card)
CustomValidation Cho phép người dùng tự viết hàm xử lý kiểm tra lỗi
EmailAddress Kiểm tra email người dùng nhập vào có hợp lệ?
FileExtension Kiểm tra phần mở rộng của một tập tin
MaxLength  Kích thước tối đa của trường dữ liệu nhập vào
MinLength  Kích thước tối thiểu của trường dữ liệu nhập vào
Phone Kiểm tra số phone có hợp lệ?

Ví dụ kiểm tra việc chỉnh sửa Sinh viên :

Bước 1: Chúng ta muốn xác thực rằng StudentName và Age không trống. Ngoài ra, Tuổi nên nằm trong khoảng từ 5 đến 50. 

public class Student
{
    public int StudentId { get; set; }
     
    [Required]
    public string StudentName { get; set; }
       
    [Range(5,50)]
    public int Age { get; set; }
}

Trong ví dụ trên, chúng ta đã thêm một thuộc tính bắt buộc nhập  cho thuộc tính StudentName. Vì vậy, bây giờ, Framework MVC sẽ tự động hiển thị thông báo lỗi mặc định, nếu người dùng cố lưu biểu mẫu Chỉnh sửa mà không nhập Tên sinh viên. Theo cách tương tự, thuộc tính Range được áp dụng với giá trị tối thiểu và tối đa cho thuộc tính Age. Điều này sẽ xác thực và hiển thị thông báo lỗi nếu người dùng chưa nhập Tuổi hoặc nhập tuổi dưới 5 hoặc hơn 50.

Chúng ta cũng có thể áp dụng nhiều thuộc tính xác thực DataAnnotations cho một thuộc tính nếu được yêu cầu.
 

Bước 2: Tạo phương thức Edit  GET và POST giống như phần trước. Phương thức GET sẽ hiển thị Edit xem chỉnh sửa sinh viên đã chọn,  phương thức Edit dạng POST sẽ lưu sinh viên đã chỉnh sửa như hiển thị bên dưới.

using MVC_BasicTutorials.Models;

namespace MVC_BasicTutorials.Controllers
{
    public class StudentController : Controller
    {
        public ActionResult Edit(int id)
        {
            var std = studentList.Where(s => s.StudentId == id)
                                 .FirstOrDefault();

            return View(std);
        }

        

        [HttpPost]
        public ActionResult Edit(Student std)
        {
            if (ModelState.IsValid) { 
            
                //write code to update student 
            
                return RedirectToAction("Index");
            }
            
            return View(std);
        }
    }
}

Như bạn có thể thấy trong phương thức POST Edit, trước tiên chúng tôi kiểm tra xem ModelState có hợp lệ hay không. Nếu ModelState hợp lệ thì cập nhật sinh viên vào cơ sở dữ liệu, nếu không thì quay lại  chế độ Edit cùng dữ liệu sinh viên.

ModelState.IsValid xác định rằng liệu các giá trị được gửi có đáp ứng tất cả các thuộc tính xác thực DataAnnotation được áp dụng cho các thuộc tính mô hình hay không.

Bước 3: Bây giờ, phương thức Edit.

Để tạo phương thức Edit, nhấp chuột phải vào bên trong Chỉnh sửa phương thức hành động -> click vào Add View ..

Trong hộp thoại Add View, giữ tên xem là Chỉnh sửa. (Bạn có thể thay đổi theo yêu cầu của bạn.)

Chọn mẫu Edit template trong danh sách thả xuống template và cũng chọn lớp Model Student như dưới đây.

Bây giờ, click vào Add để tạo Edit trong thư mục View/Student. Tập tin Edit.cshtml sẽ được tạo ra:

@model MVC_BasicTutorials.Models.Student

@{
    ViewBag.Title = "Edit";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>Edit</h2>

@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()
    
    <div class="form-horizontal">
        <h4>Student</h4>
        <hr />
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        @Html.HiddenFor(model => model.StudentId)

        <div class="form-group">
            @Html.LabelFor(model => model.StudentName, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.StudentName, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.StudentName, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.Age, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.Age, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.Age, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="Save" class="btn btn-default" />
            </div>
        </div>
    </div>
}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

Như bạn có thể thấy trong Edit.cshtml ở trên, nó gọi phương thức  ValidationMessageFor cho mọi trường và phương thức ValidationSummary ở trên cùng. ValidationMessageFor  hiển thị thông báo lỗi cho trường được chỉ định. ValidationSummary hiển thị danh sách tất cả các thông báo lỗi cùng một lúc.

Vì vậy, bây giờ, nó sẽ hiển thị thông báo xác thực mặc định khi bạn lưu mà không cần nhập Tên hoặc Tuổi.

 Những điểm cần nhớ:

  1. ASP.NET MVC sử dụng thuộc tính DataAnnotations để xác thực.
  2. Các thuộc tính DataAnnotations có thể được áp dụng cho các thuộc tính của lớp model để chỉ ra loại giá trị mà thuộc tính sẽ giữ.
  3. Các thuộc tính xác thực mặc định.
    1. Required
    2. StringLength
    3. Range
    4. RegularExpression
    5. CreditCard
    6. CustomValidation
    7. EmailAddress
    8. FileExtension
    9. MaxLength
    10. MinLength
    11. Phone
  4. Sử dụng ValidationSummary để hiển thị các thông báo lỗi
  5. Sử dụng phương ValidationMessageFor hoặc ValidationMessage để hiển thị các thông báo lỗi
  6. Kiểm tra xem model có hợp lệ không trước khi cập nhật bằng thuộc tính ModelState.IsValid.
  7. Cho phép xác thực phía máy khách để hiển thị thông báo lỗi mà không cần gửi lại server.