[.NET] Cú pháp Razor trong ASP.NET

 Cú pháp Razor thay thế các thẻ HTML, giúp viết các thẻ HTML nhanh hơn và truyền dữ liệu tham số tường minh hơn.

1. Tạo 1 thẻ Form bằng cú pháp Razor

    <div> 

        @*Tao the Form*@

        @using (Html.BeginForm("Demo","Index",FormMethod.Post))

        {

        }

    </div>

Trong đó:

- Demo: Là tên Controller.

- Index: Là tên Action.

- FormMethod: Là phương thức.

2. Tạo TextBox

    <div> 

        @*Tao the Form*@

        @using (Html.BeginForm("Demo","Index",FormMethod.Post))

        {

            @*Tao the textbox*@

            @Html.TextBox("txtHoTen","text",new { @id="id1",@class="new-class"})

        }

    </div>

Trong đó:

- txtHoTen: là tên của textbox

- text: là giá trị 

- new { @id="id1",@class="new-class"}: là thuộc tính đối tượng khác.

3. Thẻ TextArea

            @*The textarea*@

       @Html.TextArea("txtDiaChi",new{@cols="5",@rows="5"})

Trong đó: 

- txtDiaChi: là tên của textarea.

- new{@cols="5",@rows="5"}: là thuộc tính đối tượng khác, ở đây định nghĩa số dòng, số cột.

4. Thẻ Password

        @Html.Password("txtpass","123456",new { @id = "passid" })

Trong đó

- txtpass: là tên của thẻ password.

- 123456: là giá trị

- new{ @id="passid"}: là thuộc tính đối tượng khác.

5. Thẻ actionlink

@Html.ActionLink("Click here","Index","Demo", new { @id="id",@class="new-class"})

Trong đó:

- Click here: Là giá trị Action Link.

- Index: là action

- Demo: Là controller

- new {}: là thuộc tính đối tượng khác.

6. Thẻ Hidden

        @Html.Hidden("txthidden", "123456", new { @id="idh"})

Trong đó:

- txthidden: là tên thẻ hidden.

- 123456: là giá trị của thẻ hidden.

- new{}: là thuộc tính đối tượng khác.

7. Thẻ Radio Button

<span>The raidio button</span>

            @Html.RadioButton("GioiTinh",0,true)<span>Nam</span>

            @Html.RadioButton("GioiTinh",1,false)<span>Nu</span>

Trong đó:

- GioiTinh: là tên Radio.

- 0,1 là giá trị được lấy khi check.

- True,False: Thuộc tính html của radio (checked).

8. Thẻ Checkbox

     <span>Màu sách yêu thích của bạn</span>

  @Html.CheckBox("Red", true, new { @value = "red" })<span>Màu đỏ</span>

  @Html.CheckBox("Blue", true, new { @value = "blue" })<span>Màu xanh</span>

  @Html.CheckBox("Green", false, new { @value = "green" })<span>Màu xanh lá cây</span>

Trong đó:

- Red, Blue, Green: Là tên checkbox, trường hợp nếu đặt tên giống nhau, thì nó sẽ trang về cho chúng ta 1 mảng.

- true,flase: Đã check hay chưa.

- new{}: Thuộc tính html của check box (@value: Giá tị được lấy khi check).

9. Thẻ DropDownList

Trong Model

public class TinhThanhPho

    {

        public string MaTP { get; set; }

        public string TenTP { get; set; }

    }

Trong Controller

[HttpGet]

        public ActionResult Demo()

        {

            //Tao 1 list TinhThanhPho

            List<TinhThanhPho> ltp = new List<TinhThanhPho>();

            TinhThanhPho ttp;

            ttp = new TinhThanhPho();

            ttp.MaTP = "1";

            ttp.TenTP = "Ho Chi Minh";

            ltp.Add(ttp);

            ttp = new TinhThanhPho();

            ttp.MaTP = "2";

            ttp.TenTP = "Da Nang";

            ltp.Add(ttp);

            ttp = new TinhThanhPho();

            ttp.MaTP = "3";

            ttp.TenTP = "Ha Noi";

            ltp.Add(ttp);

            ViewBag.ltps = new SelectList(ltp, "MaTP", "TenTP");

            return View();

        }

        [HttpPost]

        public ActionResult Demo(FormCollection f)

        {

            List<TinhThanhPho> ltp = new List<TinhThanhPho>();

            TinhThanhPho ttp;

            ttp = new TinhThanhPho();

            ttp.MaTP = "1";

            ttp.TenTP = "Ho Chi Minh";

            ltp.Add(ttp);

            ttp = new TinhThanhPho();

            ttp.MaTP = "2";

            ttp.TenTP = "Da Nang";

            ltp.Add(ttp);

            ttp = new TinhThanhPho();

            ttp.MaTP = "3";

            ttp.TenTP = "Ha Noi";

            ltp.Add(ttp);

            ViewBag.ltps = new SelectList(ltp, "MaTP", "TenTP");

            ViewBag.ketqua = f["TenDLTP"];

            return View();

        }

Trong View

<div>

        @using (Html.BeginForm("Demo", "Demo", FormMethod.Post))

        {

            <span>Vui Lòng lựa chọn Tỉnh Thành Phố</span>

            SelectList ttp = (SelectList)ViewBag.ltps;

            @Html.DropDownList("TenDLTP", ttp, new { @id = "tagSelection" });

            if (ViewBag.ketqua != null)

            {<span>@ViewBag.ketqua </span>

            }

            <input type="submit" />

        }

        

    </div>

Trong đó:

- TenDLTP: là tên của DropdownList.

- ttp: đối tượng SelectList(IEnumerable)

- {@}: thuộc tính html của droplist (ví dụ như size, maxlenght,...)

10. Thẻ ListBox (ít dùng)