ASP.NET MVC HtmlHelper

,ASP.NET MVC提供了一個HtmlHelper用於生成有數據綁定的Html標籤。javascript

1.ActionLink
其中最經常使用的就是Html.ActionLinkhtml

(1).ActionLink(string linkText, string actionName)java

//頁面顯示linkText指向Global.asax.cs中默認的Controller對象的actionName方法數據庫

(2).ActionLink(string linkText, string actionName, string controllerName)數組

//頁面顯示linkText指向controllerName對應的Controller的actionName方法url

(3).ActionLink(string linkText,string actionName,object routues,object htmlAttributes)orm

//頁面顯示linkText指向Global.asax.cs中默認的Controller對象的actionName方法,而且傳遞參數給action方法(以匿名類型的名稱/值對的方式來實現),並設置頁面連接的屬性htmlAttributes。htm

1.1基本的使用方式
在UrlRouting規則爲默認規則的狀況下,它生成的HTML代碼爲對象

1: <a href="/">這是一個鏈接</a>ip

ActionLink中的三個參數分別爲

顯示的文字
Action
Controller
其中Controller能夠省略,省略時指向同一Controller下的Action。

1.2ActionLink中QueryString與Html屬性設置
1: 帶有QueryString的寫法
2: <%=Html.ActionLink("這是一個鏈接", "Index", "Home", new { page=1 },null)%>
3: <%=Html.ActionLink("這是一個鏈接", "Index", new { page=1 })%>
4: 有其它Html屬性的寫法
5: <%=Html.ActionLink("這是一個鏈接", "Index", "Home", new { id="link1" })%>
6: <%=Html.ActionLink("這是一個鏈接", "Index",null, new { id="link1" })%>
7: QueryString與Html屬性同時存在
8: <%=Html.ActionLink("這是一個鏈接", "Index", "Home", new { page = 1 }, new { id = "link1" })%>
9: <%=Html.ActionLink("這是一個鏈接", "Index" , new { page = 1 }, new { id = "link1" })%>

其生成結果爲:

1: 帶有QueryString的寫法
2: <a href="/?page=1">這是一個鏈接</a>
3: <a href="/?page=1">這是一個鏈接</a>
4: 有其它Html屬性的寫法
5: <a href="/?Length=4" id="link1">這是一個鏈接</a>
6: <a href="/" id="link1">這是一個鏈接</a>
7: QueryString與Html屬性同時存在
8: <a href="/?page=1" id="link1">這是一個鏈接</a>
9: <a href="/?page=1" id="link1">這是一個鏈接</a>

這樣就能夠使用ActionLink生成近乎全部的地址鏈接了。

注意,若是鏈接中不涉及到action及controller就沒有必要使用ActionLink,而是直接寫HTML代碼就能夠了,例如

1: <a href="#1">一章</a>
2: <a href="javascript:void(0)" onclick="delete();">刪除</a>

2.RouteLink
2.1與ActionLink
RouteLink與ActionLink相差無幾,只是它的地址是由Route生成拿上面的例子

1: <%=Html.ActionLink("這是一個鏈接", "Index", "Home")%>

來講,若是用RouteLink來寫就是

1: <%=Html.RouteLink("這是一個鏈接", new { controller="Home",action="Index"})%>

而帶上QueryString以及Html屬性的ActionLink

1: <%=Html.ActionLink("這是一個鏈接", "Index" , new { page = 1 }, new { id = "link1" })%>

就能夠這樣來寫

其實就是用一個新創建的RoutueDictionary的對象(new{}所實例化的對象將會等價轉換爲RoutueDictionary)來替原來的Action,Controller字符串的單獨指定。

2.2RouteLink使用Route規則
除了這些協同的用法,RouteLink還支持使用Route規則名來建立鏈接

例如咱們在Global.asax文件中添加一個Route規則

1: routes.MapRoute(
2:  "about",//這是規則名
3:  "about",//url
4:  new {controller = "Home", action = "about"}
5:  );

那麼咱們就能夠使用這個Route規則

1: <%=Html.RouteLink("關於", "about", new { })%>
2: <%=Html.RouteLink("關於", "about", new { page = 1 })%>
3: <%=Html.RouteLink("關於", "about", new { page = 1 }, new { id = "link1" })%>

來生成以下的HTML:

1: <a href="/about">關於</a>
2: <a href="/about?page=1">關於</a>
3: <a href="/about?page=1" id="link1">關於</a>

3.表單
不少狀況下是要生成表單元素的,正如文章開始所述,修改一個內容的狀況下,咱們可能要將數據與表單綁定。

3.1生成Form
咱們固然能夠使用純的Html代碼或UrlHelper來生成一個Form。

可是由於是在HTML的屬性中,因此仍是難以維護,幸虧ASP.NET MVC爲咱們提供了一個Helper,咱們能夠經過如下兩種方式生成一個Form:

1: <%using(Html.BeginForm("index","home",FormMethod.Post)){%>
2: 表單內容
3: <%} %>
4: <%Html.BeginForm("index", "home", FormMethod.Post);//注意這裏沒有=輸出%>
5: 表單內容
6: <%Html.EndForm(); %>

BeginForm方法相似於ActionLink的調用方式,因此ASP.NET MVC還提供了BeginRouteForm這種方法。

固然這裏咱們也能夠使用new{}來爲form的action增長querystring或HTML屬性,方法與前面介紹的大同小異,參見方法列表便可。

3.2表單元素
ASP.NET MVC提供了多種表單元素的Helper。

其中包括:TextBox(相似input type=text,下面相似)、TextArea、DropDownList(select)、CheckBoxHidden、ListBox、Password、RadionButton。

注意:由於<input type=」submit」 />通常狀況下是不會綁定數據的因此ASP.NET MVC並未提供此Helper(曾經提供過在preview2以前)。

若是咱們想提供一個input type=text 它的name爲t1則如下代碼:

1: <%=Html.TextBox("t1") %>

3.3表單元素綁定
若是咱們想要讓上文中的t1初始時就有一個值,好比 「重典」那麼咱們能夠按如下方式

1: <%=Html.TextBox("t1","重典") %>

若是數據是從數據庫中讀取,即獲得數據是從Action中獲取的,那麼咱們能夠在Action中使用ViewData傳遞

Action:

1: ViewData["name"]="重典";

View:

1: <%=Html.TextBox("t1",ViewData["name"]) %>

以上方法看似簡單,其實ASP.NET MVC爲咱們提供了更爲簡便的綁定方式---只要保證ViewData的Key與Helper所生成元素的name保持一致就能夠自動綁定:

Action:

1: ViewData["t1"]="重典";

View:

1: <%=Html.TextBox("t1") %>

這樣就能夠自動綁定了

3.4列表數據顯示與綁定
像TextBox這種值單一的數據比較容易,可是存在的數據比較多的DropDownList或ListBox應該怎麼綁定數據及初始化值呢,咱們來看看下面的例子:

Action:

1: ViewData["sel1"] = new SelectList(
2:  new[] {1, 2, 3}
3:  , 3
4:  );

View:

1: <%=Html.DropDownList("sel1")%>

這樣就能夠將列表內容、默認值、以及表單元素三者綁定在一塊兒了。

而咱們的列表內容並非任何狀況下都是數組的,大多狀況下仍是Key-Value對居多。

咱們能夠使用如下方式:

1: List<SelectListItem> list = new List<SelectListItem> 2:  { 3:  new SelectListItem {Text = "重典", Value = "1"}, 4:  new SelectListItem {Text = "鄒健", Value = "2"}, 5:  }; 6: ViewData["sel1"] = new SelectList( 7:  list 8:  , "2" 9:  );

相關文章
相關標籤/搜索