The Form Tag Helper

Form Tag Helper sẽ giúp bạn trong việc sinh ra thẻ Form để bao cá thành phần bên trong như trường INPUT, TEXTAREA ... Khi dùng Form Tag Helper, so với việc viết toàn bộ markup thì có nhiều ưu điểm:

• Bạn có thể trỏ đến Controller và Action để gửi FORM hoặc thậm chí là đường dẫn
• Request Verification Token được tự động sinh ra và đưa vào trong FORM để bảo vệ trang web khỏi cross-site request forgery

Controller and Action attributes

Cách dễ nhất và có thể là thông dụng nhất là sử dụng Form Tag Helper là với thuộc tính controller và action. Nó cho phép bạn xác định action nào trong controller nào bạn muốn Form được gửi tới. Đây là một ví dụ:

<form method="post" asp-controller="Blog" asp-action="UpdateEntry"></form> 

Chú ý cách tôi trộn thuộc tính HTML thông thường (thuộc tính method) với thuộc tính Tag Helper (asp-controller và asp-controller). Thì kết quả có Form tương tự như sau:

<form method="post" action="/Blog/UpdateEntry">  
    <input name="__RequestVerificationToken" type="hidden" value="CfDJ8IVs_IPAjddLnF3cGQU5ywNWoiF_3N0ZpjIkXnpjYFazt7cZcCPogKdTTfI7sFI7JyxIpH8ofcou78e5K7b8vUZcWpKZmvqU3e8nzumwm6WaHWXNMnQSvIB6P_Ok0mVwUloJN4MAkDxhxHlU71iJxqY">  
</form>

Như bạn thấy, Tag Helper chuyển hai giá trị của thuộc tính (controller và action) sang thuộc tính của Form HTML action /Blog/UpdateEntry. Cùng lúc, trường ẩn INPUT được sinh ra để lưu Request Verification Token.

The Route attribute

Bạn có thể thấy ở trên, để hướng tới phương thức Controller và Action rất dễ - bạn chỉ chỉ xác định tên của phương thức Controller và tên của Action. Tuy nhiên, một cách làm khác là bạn có thể xác định đích là đường dẫn - đường dẫn sẽ có trách nhiệm tìm chính xác Action. Bạn dùng thuộc tính asp-route và đây là ví dụ minh họa:

<form method="post" asp-route="UpdateBlogEntry"></form>

Giá trị chỉ đinh trong thuộc tính asp-route nên trùng với tên định nghĩa trong đường dẫn mà bạn muốn dẫn tới ví dụ:

[Route("Blog/Update", Name = "UpdateBlogEntry")]  
public IActionResult Update()  
{  
    .....

Thuộc tính action sẽ có dạng sau:

<form method="post" action="/Blog/Update">
    .....

Appending route parameters

Đường dẫn bạn muốn trỏ tới có thể có một hay vài tham số mà bạn muốn truyền vào từ FORM. Cú pháp như sau:

asp-route-[parameter-name]="value"

Nếu tên của tham số là id, thì thẻ FORM hoàn chỉnh sẽ như sau:

<form method="post" asp-route="UpdateBlogEntry" asp-route-id="42"></form>

Tất nhiên, trong tất cả các tình huống, giá trị có thể là động và giống Model như sau:

<form method="post" asp-route="UpdateBlogEntry" asp-route-id="@Model.Id"></form>

Kết quả có dạng như sau:

<form method="post" action="/Blog/Update?id=42">
    .....

More options

Đây là một trong số các thuộc tính trong Tag Helper FORM. Để theo dõi hoàn chỉnh thì hãy đọc tại documentation.

Summary

Tag Helper FORM giúp bạn tạo ra Form HTML trong khi có thêm bảo mật với Request Verification Token.