Sử dụng Data Annotations trong ASP.NET MVC

Trong ASP.NET MVC, bạn muốn kiểm soát các dữ liệu nhập vào từ người dùng, và các dữ liệu ấy được định nghĩa trong một vị trí hoặc không cần phải viết lại nhiều điều luật trên nhiều vị trí khác nhau.

Vì thế, hôm nay mình sẽ giới các bạn Data Annotations, một thư viện rất tốt, nó vừa giúp chúng ta validate một cách dễ dàng, và còn có một tính bảo mật cao.

Data Annotations

Trong .Net Framework, Data Annotation dùng để thêm ý nghĩa mở rộng vào dữ liệu thông qua các thẻ thuộc tính. Chúng ta có thể quản lý dữ liệu được định nghĩa trong một vị trí hoặc không cần phải viết lại nhiều điều luật trên nhiều vị trí khác nhau.

1. Các thuộc tính của Data Annotations

Bây giờ mình sẽ liệt kê các thuộc tính nên dùng cho CodeFirst, bởi vì nếu các bạn tạo dự án theo CodeFirst thì phải định nghĩa đâu là khóa chính, khóa ngoại, các mối quan hệ của các lớp bảng,... trong database.

Key

Dùng để định nghĩa các thuộc tính nào là khóa chính.

Bây giờ, giả sử mình có lớp Student, sử dụng tên StudentID thay vì ID. Khi Code First không tìm thấy một thuộc tính phù hợp với quy ước này, nó sẽ đưa ra một ngoại lệ vì yêu cầu của Entity Framework là bạn phải có một primary key.

Để giải quyết, mình sẽ thêm thuộc tính [Key], và StudentID sẽ thành khóa chính:

public class Student{
   [Key]
   public int StudentID { get; set; }
   public string LastName { get; set; }
   public string FirstName { get; set; }
}

Trong Entity Framework còn hỗ trợ các bạn các khóa tổng hợp, nói cách khác là có thể dùng nhiều khóa, các bạn có thể xem ví dụ qua lớp sau, với OrderID và ProductID là khóa chính:

public class OrderDetail{
   [Key, Column(Order = 1)]
   public int OrderID { get; set; }
 
   [Key, Column(Order = 2)]
   public int ProductID { get; set; }
}

Table

Mặc định của Code First là tạo ra một bảng giống với tên class. Nhưng không phải lúc nào tên bảng trong database cũng giống với tên class, và các bạn có thể dùng thuộc tính Table để đổi tên bảng.

Chúng ta hãy xem một ví dụ trong đó class được đặt tên là Student, và theo quy ước, Code First sẽ ánh xạ tới một bảng có tên là Student. Nhưng bạn có thể chỉ định tên của bảng với thuộc tính Table như đoạn code sau:

[Table("StudentsInfo")]
public class Student{
   [Key]
   public int StudentID { get; set; }
 
   [Required]
   public string LastName { get; set; }
 
   [Required]
   public string FirstName { get; set; }
}

Column

Nó cũng giống như thuộc tính Table, thuộc tính Column nó sẽ ghi đè lên các cột trong bảng.

Hãy tìm hiểu Column qua ví sau, mình muốn đổi tên cột DOB thành DateOfBirth.

public class Student{
   public int ID { get; set; }
   public string LastName { get; set; }
 
   [Column("DateOfBirth")]
   public string DOB { get; set; }
}

ForeignKey

Quy ước Code First sẽ xử lý các mối quan hệ phổ biến nhất trong model của bạn, nhưng có một số trường hợp bạn cần trợ giúp. Ví dụ, bạn muốn định nghĩa khóa chính khóa ngoại ở class Post.cs như sau:

 [Key]
 public int PostId { get; set; }
 [ForeignKey]
 public int BlogId { get; set; }

Ok, mình đã điểm qua các thuộc tính hay dùng khi Code First, ngoài ra bạn có thể tìm hiểu thêm các thuộc tính sau:

Index: chỉ mục
NotMapped: không ánh xạ (không kết nối)
nverseProperty: Thuộc tính đảo ngược, dùng để tạo quan hệ giữa các bảng 1-n hoặc n-n.

Và tiếp theo cũng là thuộc tính không thể bỏ qua khi Validation, các bạn hãy xem ví dụ sau và chúng

ta cùng phân tích nhé:

namespace DataAnnotation.Models {
    public class Employee {
        [Key] 
        public int Id { get; set; }

        [DisplayName("Employee Name")]
        [Required(ErrorMessage = "Employee name is required")]
        [StringLength(35)]
        public string Name { get; set; }

        [Required(ErrorMessage = "Address is required")]
        [StringLength(300)]
        public string Address { get; set; }

        [Required(ErrorMessage = "Salary is required")]
        [Range(3000, 1000000, ErrorMessage = "Salary must be between 3000 and 1000000")]
        public decimal Salary { get; set; }

        [Required(ErrorMessage = "Email is required")]
        [DataType(DataType.EmailAddress)]
        [DisplayName("Email Address")]
        [MaxLength(50)]
        [RegularExpression(@"[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}", ErrorMessage = "please enter correct address")]
        public string Email { get; set; }
    }
}

Qua ví dụ trên, các bạn sẽ thấy các validate sau:

DisplayName : Định nghĩa tên cột trong bảng
Required: Yêu cầu đây là trường bắt buộc nhập
StringLength : Định nghĩa độ dài tối đa cho trường dữ liệu
Range : Cài đặt min max cho giá trị
DataType : validate dữ liệu nhập vào có đúng theo các DataType được định nghĩa sẵn không (date, EmailAddress...)
RegularExpression : Kiểm tra chuỗi nhập vào theo 1 biểu thức chính quy tự định nghĩa

2. Áp dụng Data Annotation

Để các bạn hiểu hơn về Data Annotation, hãy cùng áp dùng các Data Annotation này nhé:

2.1. Đầu tiên các bạn tạo một Project ASP.NET MVC mới với tên DataAnnotationSolution, sau đó chọn MVC:

2.2. Tại một class mới trong folder Models với tên class là Student:

Và thêm đoạn code bên dưới vào Student.cs:

using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Data.Entity;
using System.Linq;
using System.Web;

namespace DataAnnotationSolution.Models
{
    

    public class Student { 

    [ScaffoldColumn(false)]
    public int StudentID { get; set; }

    [DataType(DataType.Text)]
    [Required(ErrorMessage = "Please enter name"), MaxLength(30)]
    [Display(Name = "Student Name")]
    public string Name { get; set; }

    [Required(ErrorMessage = "Please enter marks")]
    public int Marks { get; set; }

    [DataType(DataType.EmailAddress)]
    [Required(ErrorMessage = "Please enter Email ID")]
    [RegularExpression(@"^\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$", ErrorMessage = "Email is not valid.")]
    public string Email { get; set; }

    [Required(ErrorMessage = "Please enter department")]
    public string Department { get; set; }

    [Required(ErrorMessage = "Please enter Mobile No")]
    [Display(Name = "Contact Number")]
    [DataType(DataType.PhoneNumber)]
    public int Mobile { get; set; }  
    }

    public class StudentsDbcontext : DbContext
    {
        public DbSet<Student> Students { get; set; }
    }
}

Để thêm các DbContext bạn cần cài đặt Entity Framework:

2.3. Tiếp theo bạn cần thêm EmptyController với tên là StudentController.cs

Kết quả như sau:

public ActionResult Index()
{
     return View();
}

2.4. Tiếp theo bạn cần add View, bằng cách nhấp chuột vào View như hình dưới:

Tiếp theo các bạn chọn như dưới dưới:

Và kết quả trong file Student/Index.cs sẽ như sau:

@model DataAnnotationSolution.Models.Student

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>


@using (Html.BeginForm()) 
{
    @Html.AntiForgeryToken()
    
    <div class="form-horizontal">
        <h4>Student</h4>
        <hr />
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        <div class="form-group">
            @Html.LabelFor(model => model.Name, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.Name, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.Name, "", new { @class = "text-danger" })
            </div>
        </div>

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

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

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

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

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

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

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

Và thế là xong, các bạn có thể kiểm tra các validation, như bỏ trống hoặc điền sai như bạn quy ước:

Lời kết

Theo ý kiến cá nhân của mình thì annotation là một thư viện rất tốt, nó vừa giúp chúng ta validate một cách dễ dàng, và còn có một tính bảo mật cao.

Các bạn có thể download source code của mình link dưới đây:

https://drive.google.com/file/d/1dJwTxDPKOAZzYo7SaEPFnZwp29TduVfS/view?usp=sharing

Trong series tới mình sẽ hướng dẫn các bạn về cách dùng Data Annotations trong ASP.NET Core MVC, hãy theo dõi blog mình để đó chờ những bài viết mới nhất của mình nhé.

Chúc các bạn thành công.

By Hiếu Quốc

Post Top Ad

Sử dụng Data Annotations trong ASP.NET MVC

Data Annotations

1. Các thuộc tính của Data Annotations

Key

Table

Column

ForeignKey

2. Áp dụng Data Annotation

Lời kết

2 comments:

Author Details

Popular

Recent

Comments

Sponsor

Tags

Contact Form

Pages