HTML Helper是返回一個字串的方法。該字串可以代表任何類型的內容。例如可以使用HTML Helpers函數來成為標準的HTML標記,如HTML的<input>和<img>標記。也可以使用HTML輔助函數來呈現更複雜的內容,如標籤或資料庫的HTML表格。
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Index.aspx.cs" Inherits="MvcApplication1.Views.Home.Index"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns= "http://www.w3.org/1999/xhtml ">
<head id="Head1" runat="server">
<title>Index</title>
</head>
<body>
<div>
<% using
(Html.BeginForm()){ %>
<label for="firstName">First Name:</label>
<br />
<%= Html.TextBox("firstName")%>
<br /><br />
<label for="lastName">Last Name:</label>
<br />
<%= Html.TextBox("lastName")%>
<br /><br />
<input type="submit" value="Register" />
<% } %>
</div>
</body>
</html>
該Html.BeginForm()Helper方法用於建立在開始和結束的HTML<form>標記。要注意的是Html.BeginForm()方法被調用using語句中。 using語句確保<form>標籤在using塊結束時關閉。
開發者可以使用Html.EndForm()輔助方法來關閉<form>標籤,使用任何方法來建立一個開閉,不用建立一個block。
Html.TextBox(),要呼叫HTML Helper時是採用<%=%>標記,而不是<%%>標記呈現。
<%@ Page Language="C#" AutoEventWireup="false" CodeBehind="Index.aspx.cs" Inherits="MvcApplication1.Index" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Index</title>
</head>
<body>
<div>
<form action="http://localhost:33102/" method="post">
<label for="firstName">First Name:</label>
<br />
<input id="firstName" name="firstName" type="text" value="" />
<br /><br />
<label for="lastName">Last Name:</label>
<br />
<input id="lastName" name="lastName" type="text" value="" />
<br /><br />
<input id="btnRegister" name="btnRegister" type="submit" value="Register" />
</form>
</div>
</body>
</html>
建立一個HTML Helper最簡單的方法,是創建一個返回字符串的靜態方法。
namespace MvcApplication1.Helpers
{
public class LabelHelper
{
public static string Label(string target, string text)
{
return String.Format("<label
for='{0}'>{1}</label>", target, text);
}
}
}
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Index2.aspx.cs" Inherits="MvcApplication1.Views.Home.Index2"%>
<%@ Import Namespace="MvcApplication1.Helpers" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>Index2</title>
</head>
<body>
<div>
<% using
(Html.BeginForm())
{ %>
<%=
LabelHelper.Label("firstName", "First Name:") %>
<br />
<%= Html.TextBox("firstName")%>
<br /><br />
<%=
LabelHelper.Label("lastName", "Last Name:") %>
<br />
<%= Html.TextBox("lastName")%>
<br /><br />
<input type="submit" value="Register" />
<% } %>
</div>
</body>
</html>
要創建一個標準HTML Helper 運作方式如同ASP.NET MVC framework,需要建立extension methods。extension methods能夠以現有的類添加新的方法。建立一個HTML Helper的方法,添加新的方法來通過一個視圖的html屬性所代表的HtmlHelper類別。
namespace MvcApplication1.Helpers
{
public static class LabelExtensions
{
public static string Label(this HtmlHelper helper, string target, string text)
{
return String.Format("<label
for='{0}'>{1}</label>", target, text);
}
}
}
當建立一個extension methods之後,並成功地構建應用程序,extension methods會出現在Visual Studio的自動類別清單裡。
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Index3.aspx.cs" Inherits="MvcApplication1.Views.Home.Index3" %>
<%@ Import Namespace="MvcApplication1.Helpers" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>Index3</title>
</head>
<body>
<div>
<% using
(Html.BeginForm())
{ %>
<%= Html.Label("firstName", "First Name:") %>
<br />
<%= Html.TextBox("firstName")%>
<br /><br />
<%= Html.Label("lastName", "Last Name:") %>
<br />
<%= Html.TextBox("lastName")%>
<br /><br />
<input type="submit" value="Register" />
<% } %>
</div>
</body>
</html>
在Web開發之中,Helper可以運用在像是「下拉式連動選單」這樣的設計上。唯一特別的事,此方式是採用MVC的架構導向。所以在設計上,可以是更有架構,程式也更為簡潔。
-雲遊山水為知已逍遙一生而忘齡- 電腦神手
沒有留言:
張貼留言