【翻译】了解ASP.NETMVC的HTML助手-创新互联

原文：Understanding HTML Helpers in ASP.NET MVC

成都创新互联专注于团风网站建设服务及定制，我们拥有丰富的企业做网站经验。热诚为您提供团风营销型网站建设，团风网站制作、团风网页设计、团风网站官网定制、重庆小程序开发服务，打造团风网络公司原创品牌,更为您提供团风网站排名全网营销落地服务。

作者：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字符串的方法。这些字符串可以用来表现你所期望的任何内容。例如，可以使用HTML助手来渲染标准的HTML标记，如HTML的<input>、<button>和<img>等标记。

还可以通过创建自定义的HTML助手来渲染更多更复杂的内容，如菜单条或用来显示数据库数据的HTML表格。

不同类型的HTML助手

以下列出了三种类下的HTML助手：

内联式的HTML助手

这些需要在同一视图内使用Razor的@hepler标记来创建。这些助手可以在同一视图内被重用。

@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#" })

内置的HTML助手

内置的HTML助手是HtmlHelper类的扩展方法。内置的HTML助手可以划分为3种类型：

标准的HTML助手

这些助手可以用来渲染最常用的HTML元素类型，如HTML文本输入框、复选框等。以下是最常用的标准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>

强类型的HTML助手

这些助手主要用来在强类型视图内渲染最常用的HTML元素类型，如HTML文本输入框、复选框等等。HTML元素会根据模型属性来创建。强类型HTML助手需要与lambda表达式一起使用。模型对象会被作为lambda表达式的值来传递，而你可以从模型中选择一个字段或属性来设置HTML助手id、名称和值属性。以下是最常用的强类型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元素是被要求基于模型类的属性进行渲染的。尽管这需要一些细致和耐心的设置，但这是一种将数据显示给用户的非常灵活的做法。为了使用模板化的HTML助手来设置适合的HTML元素，需要使用DataAnnitation类的DataType特性。

例如，当使用DataType作为密码，模板化的助手会自动渲染密码类型的HTML的input元素。

模板化助手	示例
Display	渲染一个指定模型属性的只读视图，并基于属性的数据类型和元数据选择适当的HTML元素。 Html.Display("Name")
DisplayFor	前一个的助手的强类型版本。 Html.DisplayFor(m => m. Name)
Editor	为指定的模型属性渲染一个编辑器，并给予属性的数据类型和元数据选择适当的HTML元素。 Html.Editor("Name")
EditorFor	前一个的助手的强类型版本。 Html.EditorFor(m => m. Name)

自定义的HTML助手

还可以通过创建HtmlHelper类的扩展方法或在功能类内创建静态方法的方式来创建自定义的辅助方法。

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;
}
}

另外有需要云服务器可以了解下创新互联scvps.cn，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。

本文标题：【翻译】了解ASP.NETMVC的HTML助手-创新互联
分享地址：https://www.cdcxhl.com/article46/dsoeeg.html

成都网站建设公司_创新互联，为您提供品牌网站制作、网站设计、网站策划、App开发、云服务器、建站公司

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容