【翻譯】了解ASP.NETMVC的HTML助手-創(chuàng)新互聯(lián)

原文:Understanding HTML Helpers in ASP.NET MVC

成都創(chuàng)新互聯(lián)專注于團(tuán)風(fēng)網(wǎng)站建設(shè)服務(wù)及定制,我們擁有豐富的企業(yè)做網(wǎng)站經(jīng)驗(yàn)。 熱誠為您提供團(tuán)風(fēng)營銷型網(wǎng)站建設(shè),團(tuán)風(fēng)網(wǎng)站制作、團(tuán)風(fēng)網(wǎng)頁設(shè)計(jì)、團(tuán)風(fēng)網(wǎng)站官網(wǎng)定制、重慶小程序開發(fā)服務(wù),打造團(tuán)風(fēng)網(wǎng)絡(luò)公司原創(chuàng)品牌,更為您提供團(tuán)風(fēng)網(wǎng)站排名全網(wǎng)營銷落地服務(wù)。

作者:Shailendra Chauhan works as Software Analyst at reputed MNC and has more than 5 years of hand over Microsoft .NET technologies. He is a .NET Consultant and is the founder & chief editor of www.dotnet-tricks.com and www.dotnetinterviewtricks.com blogs. He is author of book ASP.NET MVC Interview Questions and Answers.
He loves to work with web applications and mobile apps using Microsoft technology including ASP.NET, MVC, C#, SQL Server, WCF, Web API, Entity Framework,Cloud Computing, Windows Azure, jQuery, jQuery Mobile, Knockout.js, Angular.js and many more web technologies. More...

HTML助手就是用來返回HTML字符串的方法。這些字符串可以用來表現(xiàn)你所期望的任何內(nèi)容。例如,可以使用HTML助手來渲染標(biāo)準(zhǔn)的HTML標(biāo)記,如HTML的<input>、<button>和<img>等標(biāo)記。

還可以通過創(chuàng)建自定義的HTML助手來渲染更多更復(fù)雜的內(nèi)容,如菜單條或用來顯示數(shù)據(jù)庫數(shù)據(jù)的HTML表格。

不同類型的HTML助手

以下列出了三種類下的HTML助手:

內(nèi)聯(lián)式的HTML助手

這些需要在同一視圖內(nèi)使用Razor的@hepler標(biāo)記來創(chuàng)建。這些助手可以在同一視圖內(nèi)被重用。

@helper ListingItems(string[] items)
{
<ol>
@foreach (string item in items)
{
<li>@item</li>
}
</ol>
}
                                                              
<h4>Programming Languages:</h4>
                                                              
@ListingItems(new string[] { "C", "C++", "C#" })
                                                              
<h4>Book List:</h4>
                                                              
@ListingItems(new string[] { "How to C", "how to C++", "how to C#" })

內(nèi)置的HTML助手

內(nèi)置的HTML助手是HtmlHelper類的擴(kuò)展方法。內(nèi)置的HTML助手可以劃分為3種類型:

標(biāo)準(zhǔn)的HTML助手

這些助手可以用來渲染最常用的HTML元素類型,如HTML文本輸入框、復(fù)選框等。以下是最常用的標(biāo)準(zhǔn)Html助手列表:

HTML元素

示例

TextBox

@Html.TextBox("Textbox1", "val")
輸出: <input  id="Textbox1" name="Textbox1" type="text"  value="val" />

TextArea

@Html.TextArea("Textarea1", "val",  5, 15, null)
輸出: <textarea  cols="15" id="Textarea1" name="Textarea1"  rows="5">val</textarea>

Password

@Html.Password("Password1", "val")
輸出: <input  id="Password1" name="Password1" type="password"  value="val" />

Hidden Field

@Html.Hidden("Hidden1", "val")
輸出: <input  id="Hidden1" name="Hidden1" type="hidden"  value="val" />

CheckBox

@Html.CheckBox("Checkbox1", false)
輸出: <input  id="Checkbox1" name="Checkbox1" type="checkbox"  value="true" /> <input name="myCheckbox"  type="hidden" value="false" />

RadioButton

@Html.RadioButton("Radiobutton1",  "val", true)
輸出: <input  checked="checked" id="Radiobutton1"  name="Radiobutton1" type="radio" value="val"  />

Drop-down list

@Html.DropDownList (“DropDownList1”, new SelectList(new  [] {"Male", "Female"}))
輸出: <select  id="DropDownList1" name="DropDownList1">  <option>M</option> <option>F</option> </select>

Multiple-select

Html.ListBox(“ListBox1”, new MultiSelectList(new []  {"Cricket", "Chess"}))
輸出: <select  id="ListBox1" multiple="multiple"  name="ListBox1"> <option>Cricket</option>  <option>Chess</option> </select>

強(qiáng)類型的HTML助手

這些助手主要用來在強(qiáng)類型視圖內(nèi)渲染最常用的HTML元素類型,如HTML文本輸入框、復(fù)選框等等。HTML元素會(huì)根據(jù)模型屬性來創(chuàng)建。強(qiáng)類型HTML助手需要與lambda表達(dá)式一起使用。模型對象會(huì)被作為lambda表達(dá)式的值來傳遞,而你可以從模型中選擇一個(gè)字段或?qū)傩詠碓O(shè)置HTML助手id、名稱和值屬性。以下是最常用的強(qiáng)類型HTML助手的列表:

HTML元素

示例

TextBox

@Html.TextBoxFor(m=>m.Name)
輸出: <input id="Name"  name="Name" type="text" value="Name-val" />

TextArea

@Html.TextArea(m=>m.Address , 5, 15, new{}))
輸出: <textarea  cols="15" id="Address" name=" Address "  rows="5">Addressvalue</textarea>

Password

@Html.PasswordFor(m=>m.Password)
輸出: <input  id="Password" name="Password"  type="password"/>

Hidden Field

@Html.HiddenFor(m=>m.UserId)
輸出: <input id="  UserId" name=" UserId" type="hidden"  value="UserId-val" />

CheckBox

@Html.CheckBoxFor(m=>m.IsApproved)
輸出: <input  id="Checkbox1" name="Checkbox1" type="checkbox"  value="true" /> <input name="myCheckbox"  type="hidden" value="false" />

RadioButton

@Html.RadioButtonFor(m=>m.IsApproved,  "val")
輸出: <input  checked="checked" id="Radiobutton1" name="Radiobutton1"  type="radio" value="val" />

Drop-down list

@Html.DropDownListFor(m => m.Gender, new  SelectList(new [] {"Male", "Female"}))
輸出: <select  id="Gender" name="Gender">  <option>Male</option> <option>Female</option>  </select>

Multiple-select

Html.ListBoxFor(m => m.Hobbies, new  MultiSelectList(new [] {"Cricket", "Chess"}))
輸出: <select  id="Hobbies" multiple="multiple"  name="Hobbies"> <option>Cricket</option>  <option>Chess</option> </select>

模板化的HTML助手

這些助手需要弄清楚那些HTML元素是被要求基于模型類的屬性進(jìn)行渲染的。盡管這需要一些細(xì)致和耐心的設(shè)置,但這是一種將數(shù)據(jù)顯示給用戶的非常靈活的做法。為了使用模板化的HTML助手來設(shè)置適合的HTML元素,需要使用DataAnnitation類的DataType特性。

例如,當(dāng)使用DataType作為密碼,模板化的助手會(huì)自動(dòng)渲染密碼類型的HTML的input元素。

模板化助手

示例

Display

渲染一個(gè)指定模型屬性的只讀視圖,并基于屬性的數(shù)據(jù)類型和元數(shù)據(jù)選擇適當(dāng)?shù)腍TML元素。

Html.Display("Name")

DisplayFor

前一個(gè)的助手的強(qiáng)類型版本。
 Html.DisplayFor(m => m. Name)

Editor

為指定的模型屬性渲染一個(gè)編輯器,并給予屬性的數(shù)據(jù)類型和元數(shù)據(jù)選擇適當(dāng)?shù)腍TML元素。
 Html.Editor("Name")

EditorFor

前一個(gè)的助手的強(qiáng)類型版本。
 Html.EditorFor(m => m. Name)

自定義的HTML助手

還可以通過創(chuàng)建HtmlHelper類的擴(kuò)展方法或在功能類內(nèi)創(chuàng)建靜態(tài)方法的方式來創(chuàng)建自定義的輔助方法。

public static class CustomHelpers
{
//Submit Button Helper
public static MvcHtmlString SubmitButton(this HtmlHelper helper, string
buttonText)
{
string str = "<input type=\"submit\" value=\"" + buttonText + "\" />";
return new MvcHtmlString(str);
}
//Readonly Strongly-Typed TextBox Helper
public static MvcHtmlString TextBoxFor<TModel, TValue>(this
HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TValue>>
expression, bool isReadonly)
{
MvcHtmlString html = default(MvcHtmlString);
     
if (isReadonly)
{
html = System.Web.Mvc.Html.InputExtensions.TextBoxFor(htmlHelper,
expression, new { @class = "readOnly",
@readonly = "read-only" });
}
else
{
html = System.Web.Mvc.Html.InputExtensions.TextBoxFor(htmlHelper,
expression);
}
return html;
}
}

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn,海內(nèi)外云服務(wù)器15元起步,三天無理由+7*72小時(shí)售后在線,公司持有idc許可證,提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案,具有“安全穩(wěn)定、簡單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢,專為企業(yè)上云打造定制,能夠滿足用戶豐富、多元化的應(yīng)用場景需求。

本文標(biāo)題:【翻譯】了解ASP.NETMVC的HTML助手-創(chuàng)新互聯(lián)
分享地址:http://www.muchs.cn/article46/dsoeeg.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供品牌網(wǎng)站制作、網(wǎng)站設(shè)計(jì)、網(wǎng)站策劃App開發(fā)、云服務(wù)器、建站公司

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)

外貿(mào)網(wǎng)站制作