ASP.NET Core MVC_Html Helper

代码

Html Helper

InputExtensions类定义了HTML Helper方法，用于创建复选框，密码控件，单选按钮和文本框控件。
Action和RenderAction helper 由ChildActionExtensions类定义。 用于显示的Helper方法由DisplayExtensions类定义。
HTML form 的帮助器方法由FormExtensions类定义。

简单示例

View

@using (Html.BeginForm())
{
    @Html.DisplayName("Check this (or not)")
    @Html.CheckBox("check1")
}

生成的Html代码

<form action="/HtmlHelpers/SimpleHelper" method="post">Check this (or not)
	<input id="check1" name="check1" type="checkbox" value="true" />
	<input name="check1" type="hidden" value="false" />
</form>

使用Model

Controller

public IActionResult HelperWithMenu() => View(GetSampleMenu());

private Menu GetSampleMenu() => 
    new Menu
    {
        Id = 1,
        Text = "Schweinsbraten mit Knödel und Sauerkraut",
        Price = 6.9,
        Date = new DateTime(2017, 11, 14),
        Category = "Main"
    };

View

@model MVCSampleApp.Models.Menu
@{
    ViewBag.Title = "HelperWithMenu";
} 
<h2>Helper with Menu</h2>
@Html.DisplayName("Text:")
@Html.Display("Text")
<br />
@Html.DisplayName("Category:")
@Html.Display("Category")

HTML 属性

大多数 HTML Helper 方法都有重载，可以传递任意HTML属性。

@Html.TextBox("text1", "input text here",
new { required="required", maxlength=15, @class="CSSDemo"
});

Html代码

<input name="text1" class="CSSDemo" id="text1" maxlength="15" required="required" type="text" value="input text here" />

创建列表

为了显示列表，helper方法提供了诸如DropDownList和ListBox。
Controller

public IActionResult HelperList()
{
    var cars = new Dictionary<int, string>();
    cars.Add(1, "Red Bull Racing");
    cars.Add(2, "McLaren");
    cars.Add(3, "Mercedes");
    cars.Add(4, "Ferrari");
    return View(cars.ToSelectListItems(4));
}

Extensions/SelectListItemsExtensions.cs

扫描二维码关注公众号，回复： 3267537 查看本文章

public static class SelectListItemsExtensions
{
    public static IEnumerable<SelectListItem> ToSelectListItems(
        this IDictionary<int, string> dict, int selected) =>
        dict.Select(item =>
        new SelectListItem
        {
            Selected = item.Key == selected,
            Text = item.Value,
            Value = item.Key.ToString()
        });
}

View

@{
    ViewBag.Title = "Helper List";
} 
@model IEnumerable<SelectListItem>
    <h2>Helper2</h2>
    @Html.DropDownList("carslist", Model)

Html代码

<select id="carslist" name="carslist">
	<option value="1">Red Bull Racing</option>
	<option value="2">McLaren</option>
	<option value="3">Mercedes</option>
	<option selected="selected" value="4">Ferrari</option>
</select>

强类型Helper

HTML Helper方法提供了强类型方法来访问从控制器传递的模型。这些方法都以名称For为后缀。
Controller

public IActionResult StronglyTypedMenu() => View(GetSampleMenu());

View

@using MVCSampleApp.Models
@model Menu
@Html.DisplayNameFor(m => m.Text)
<br />
@Html.DisplayFor(m => m.Text)

Html代码
Text属性添加了Required和MaxStringLength属性，所以从TextBoxFor方法返回data-val-length，data-val-length-max和data-val-required属性

<Input data-val="true"
	data-val-length="The field Text must be a string with a
	maximum length of 50."
	data-val-length-max="50"
	data-val-required="The Text field is required."
	id="FileName_Text" name="Text"
	type="text"
	value="Schweinsbraten mit Knödel und Sauerkraut" />

Editor扩展

EditorExtensions类的 helper方法提供包含类所有属性的编辑器，不是为每个属性使用至少一个helper方法。

Html.EditorFor(m => m)

Html.EditorForModel

模板

模板是HTML Helper方法隐式或显式使用的简单视图。 模板放在特殊文件夹中。 显示模板放在视图文件夹（Views / HtmlHelpers / DisplayTemplates）或共享文件夹（Shared / DisplayTemplates）中的DisplayTemplates文件夹中。
所有视图都使用共享文件夹; 特定视图文件夹仅由此文件夹中的视图使用。 模板编辑器放在EditorTemplates文件夹中。

DisplayTemplates
Views/HTMLHelpers/DisplayTemplates/Date.cshtml

<div style="color: #f00;">
    @string.Format("{0:D}", Model)
</div>

Controller

public IActionResult Display()=> View(GetSampleMenu());

View

@model MVCSampleApp.Models.Menu
@{
	ViewBag.Title = "Display";
} 
<h2>@ViewBag.Title</h2>
@Html.DisplayForModel()

结果