Thiết kế web bằng ASP.NET MVC (Phần 10) – HTML Helper theo http://esvn.vn/

HTML Helpers được sử dụng để điều chỉnh đầu ra HTML

---

HTML Helpers

Đối với MVC, HTML helpers giống như là các control trong ASP.Net Web Form.

Cũng giống như các control trong ASP.NET, HTML helper được sử dụng để tùy chỉnh HTML đầu ra. Nhưng HTML Helper nhẹ nhàng hơn. Không giống Web Form control, một HTML Helper không có sự kiện và view state.

Trong nhiều trường hợp, một HTML Helper là các phương thức trả về chuỗi.

Với MVC, bạn có thể tạo ra các helper của mình hoặc sử dụng các HTML helper có sẵn.

---

HTML Helpers chuẩn

MVC bao gồm các helper chuẩn cho hầu hết các loại thẻ HTML, giống như là Link và các phần tử form.

---

HTML Links

Một cách dễ nhất để tạo ra thẻ HTMLLink là sử dụng helper HTML.ActionLink().

Với MVC, Html.ActionLink() không liên kết đến 1 view. Nó tạo ra đường dẫn đến một action trong controller

Cú pháp Razor:

@Html.ActionLink("About thisWebsite", "About")

Cú pháp ASP:

<%=Html.ActionLink("Aboutthis Website", "About")%>

Tham số đầu tiên là văn bản hiển thị đường link, thứ 2 là tên của action trong controller.

Html.ActionLink() ở trên, đầu ra HTML sẽ như sau:

<ahref="/Home/About">About this Website</a>

Html.ActionLink() helper có một số thuộc tính như sau:

Thuộc tính	Mô tả
.linkText	Văn bản hiển thị (nhãn)
.actionName	Action chỉ ra
.routeValues	Gía trị gửi đến action
.controllerName	Tên controller
.htmlAttributes	Các thuộc tính gửi đến link
.protocol	Phương thức liên kết
.hostname	Tên máy chủ
.fragment	Anchor của link

Chú ý: Bạn có thể gán giá trị cho action trong controller. Ví dụ, bạn có thể gán id bản ghi vào để sửa bản ghi.

Cú pháp Razor C#:

@Html.ActionLink("EditRecord", "Edit", new {Id=3})

Cú pháp Razor VB:

@Html.ActionLink("EditRecord", "Edit", New With{.Id=3})

Helper Html.ActionLink() trên đưa ra HTML:

<ahref="/Home/Edit/3">Edit Record</a>

---

Các phần tử HTML Form

Các HTML Helper dưới đây có thể được dùng để tạo ra form HTML như sau:

• BeginForm()
• EndForm()
• TextArea()
• TextBox()
• CheckBox()
• RadioButton()
• ListBox()
• DropDownList()
• Hidden()
• Password()

Cú pháp ASP.NET C#:

<%=Html.ValidationSummary("Create was unsuccessful. Please correct the errorsand try again.") %>
<% using (Html.BeginForm()){%>
<p>
<label for="FirstName">First Name:</label>
<%= Html.TextBox("FirstName") %>
<%= Html.ValidationMessage("FirstName", "*") %>
</p>
<p>
<label for="LastName">Last Name:</label>
<%= Html.TextBox("LastName") %>
<%= Html.ValidationMessage("LastName", "*") %>
</p>
<p>
<label for="Password">Password:</label>
<%= Html.Password("Password") %>
<%= Html.ValidationMessage("Password", "*") %>
</p>
<p>
<label for="Password">Confirm Password:</label>
<%= Html.Password("ConfirmPassword") %>
<%= Html.ValidationMessage("ConfirmPassword", "*") %>
</p>
<p>
<label for="Profile">Profile:</label>
<%= Html.TextArea("Profile", new {cols=60, rows=10})%>
</p>
<p>
<%= Html.CheckBox("ReceiveNewsletter") %>
<label for="ReceiveNewsletter"style="display:inline">Receive Newsletter?</label>
</p>
<p>
<input type="submit" value="Register" />
</p>
<%}%>