第5章 表单和HTML辅助方法(HtmlHelper、辅助方法的使用、HTML辅助方法的工作原理、强类型辅助方法)

一、表单的使用

1、表单

<form action="http://www.bing.com/search" monthod="get"><input name="q" type="text"/><input type="submit" value="Search!"/></form>

产出地址：http://www.bing.com/search?q=love

2、get方法还是Post方法

在Web应用程序中，Get请求用于读操作，Post请求用于写操作（通常包括更新、创建、删除）

二、HTML辅助方法

         每一个Razor [ˈrezɚ] 视图都继承了它们基类的Html属性。

         Html属性的类型是System.Web.Mvc.HtmlHelper<T>,这里的T是一个泛型类型参数，代表传递视图的模型类型（默认是dynamic）

ASP.NET MVC 所有的HtmlHelper扩展方法都在名称空间System.Web.Mvc.Html中（在web.Config）

        @using (Html.BeginForm("Search", "Home", FormMethod.Get,            new { target="_blank",@class="editForm",data_validatable=true}))        {            <input type="text" name="q"/>            <input type="submit" value="Search"/>        }

生成后Html

<form action="/Home/Search" class="editForm" data-validatable="True" method="get" target="_blank">                       <input type="text" name="q"/>            <input type="submit" value="Search"/></form>

1、自动编码

许多辅助方法都可以用来输出模型值。所有这些输出模型值的辅助方法都会在渲染之前，对值进行HTML编码(避免XSS工具)。
如：TextArea辅助方法，输出HTML，就进行编码

@Html.TextArea("text","Hello <br/> World")

产生标记

    <textarea cols="20" id="text" name="text" rows="2">Hello <br/> World</textarea>

2、辅助方法的使用

BeginForm辅助方法的另一个重载版本：

@using (Html.BeginForm("Search", "Home", FormMethod.Get, new { target="_blank",@class="editForm",data_validatable=true})){}

生成后Html

<form action="/Home/Search" class="editForm" data-validatable="True" method="get" target="_blank"></form>

（1）、其中new { target="_blank",@class="editForm",data_validatable=true}是htmlAttributes参数，它的类型是IDictionary<string, object>，辅助方法利用字典条目（对象的属性名称和属性值）创建辅助方法生成元素的特性。
（2）、class属性前加@,是应为class是c#语言中的一个保留关键字。
（3）、属性名中带下划线生成html代码后转成连字符（第8章介绍框架的Ajax特性时，将看到带连字符的属性名）

3、HTML辅助方法的工作原理

每一个Razor视图都继承了它们基类的Html属性。Html属性的类型是System.Web.Mvc.HtmlHelper<T>,这里的T是一个泛型类型的参数，代表传递给视图的模型类型（默认是dynamic）。这个属性提供了一些可以在视图中调用的实例方法，比如：EnableClientValidation 开启关闭客户端验证.

4、设置专辑编辑表单

@using(Html.BeginForm()){    @Html.ValidationSummary(excludePropertyErrors:true)        <input type="submit" value="Save"/>}

Html.BeginForm() 向当前URL发送一个HTTP POST请求。

ValidationSummary辅助方法用来显示ModelState字典中所有验证错误的无序列表（验证摘要）。
如果值为true，只显示ModelState中与模型本身有关的错误。如：ModelState.AddModelError("Title","标题不能为空") 与Title属性关联的错误
如果值为false，只显示ModelState中与模型本身有关的错误。如：ModelState.AddModelError("","标题不能为空")

5、添加输入元素

StoreManager Edit.cshtml视图代码的表单部分，并突出显示了输入辅助方法：

（1）、Html.TextBox和Html.TextArea
（2）、Html.Label
（3）、Html.DropDownList和Html.ListBox
（4）、Html.ValidationSummary
控制器中添加ModelState.AddModelError("Title","错误");
视图中添加@Html.ValidationSummary("Title")

6、辅助方法、模型和视图数据

辅助方法提供了对HTML细粒度控制的同时带走了构建UI的乏味工作。
如：Html.TextBox和Html.DropDownList检查ViewData对象以获得要显示的值（在ViewBag对象中的所有的值也可以通过ViewData得到）
情况一：
控制器：

        public ActionResult Edit(int id)        {            ViewBag.Price = 10.0;            return View();        }

视图：
@Html.TextBox("Price")
产生结果：
<input id="Price" name="Price" type="text" value="10"/>

情况二：
控制器：

        public ActionResult Edit(int id)        {            ViewBag.Album=new Album{Price=11}            return View();        }

视图：
@Html.TextBox("Album.Price")
产生结果：
<input id="Album.Price" name="Album.Price" type="text" value="11"/>

情况三：

如果想生成的值带小数点，那么 Price=11.0m

7、强类型辅助方法

使用强类型辅助方法时，只需要为其传递一个lambda表达式来指定要渲染的模型属性。
表达式的模型类型必须和为视图指定的模型类型(使用@model指令)一致。
对于强类型视图，需要在视图顶部输入如下所示的代码：
@model MvcMusicStore.Models.Album
使用强类型辅助方法
@Html.LabelFor(model => model.GenreId, "GenreId", new { @class = "control-label col-md-2" })
注意：如果没有提供足够的信息，使其能直接读取模型的Title属性来获取需要的值。

8、辅助方法和模型元数据

如：
@Html.Label("GenreId");
生成HTML标记
<label for="GenrdId">Genre</label>
文本Genre从哪里来的？辅助方法运行时，从装饰Album模型的DisplayName特性中获取的信息。
[DisplayName("Genre")]
public int GenreId{get;set;}

9、模板辅助方法

ASP.NET MVC中模板辅助方法利用元数据和模板构建HTML。
元数据：包括关于模型值（它的名称和类型）的信息和（通过数据注解或自定义提供器添加的）模型元数据。
模型辅助方法：Html.Display和Html.Editor,以及分别与它们对应的强类型方法Html.DisplayFor和Html.EditorFor,还有它们对应的完整模型
Html.DisplayForModel和Html.EditorForModel。
例如：Html.TextBoxFor辅助方法为某个专辑的Title属性生成如下Html标记

<input id="Title" name="Title" type="text" value="值"/>

也可以用EditorFor方法取而代之：

@Html.EditorFor(m=>m.Title)

尽管两种方法生成的同样的HTML标记，但EditorFor方法是使用元数据（数据注释）来改变生成的HTML.
如下：在Title属性添加一个DataType注释。

[Required(ErrorMessage="不能为空")][StringLength(160)][DataType(DataType.MultilineText)]public string Title{get;set;}

EditorFor辅助方法生成如下HTML标记：

<textarea class="text-box multi-line" id="Title" name="Title">内容</textarea>

10、辅助方法和ModelState

存储模型绑定期间监测到的所有验证错误，以及用户提交用来更新模型的元素值。

三、其他输入辅助方法

1、Html.Hidden 隐藏的输入元素

@Html.Hidden("wizardStep","1")
强类型版本：@Html.HiddenFor(m=>m.wizardStep)
生成如下所示的HTML标记：
<input id="wizardStep" name="wizardStep" type="hidden" value="1"/>

2、Html.Password 密码字段

@Html.Password("UserPassword")
强类型版本：@Html.PasswordFor(m=>m.UserPassword)

3、Html.RadioButton

    @Html.RadioButton("color","red")
    @Html.RadioButton("color","blue",true)
    @Html.RadioButton("color","green")
生成的Html:
    <input id="color" name="color" type="radio" value="red" />
    <input checked="checked" id="color" name="color" type="radio" value="blue" />
    <input id="color" name="color" type="radio" value="green" />
强类型对应方法：
@Html.RadioButtonFor(m=>m.GenreId,"1")
@Html.RadioButtonFor(m=>m.GenreId,"2")
@Html.RadioButtonFor(m=>m.GenreId,"3")

4、Html.CheckBox

@Html.CheckBox("IsDiscounted")
唯一一个渲染两个输入元素的辅助方法。
<input id="IsDiscounted" name="IsDiscounted" type="checkbox" value="true" />
<input name="IsDiscounted" type="hidden" value="false" />
HTML规范中规定浏览器只提交选中的复选框的值。但是第二隐藏输入元素就保证了IsDiscounted有一个值会被提交，即便用户没有选择这个复选框。

四、渲染辅助方法

渲染辅助方法可在应用程序中生成指向其他资源的链接，也可以构建被称为部分视图的可重用UI片段。

1、Html.ActionLink和Html.RouteLink

ActionLink渲染一个超链接。
@Html.ActionLink("编辑","Edit","StoreManager",new {id=1},null)
生成：
<a href="/StoreManager/Edit/1">编辑</a>

Html.RouteLink只接收路由名称
@Html.RouteLink("Link Text",new {action="Edit"})

2、URL辅助方法

(1)、Action 生成一个URL(不是链接)
(2)、RouteUrl和RouteLink一样
(3)、Content 辅助方法：相对路径转换成绝对路径。

<script src="@Url.Content("~/***.js")" type="text/javascript"></scritp>
ASP.Net Mvc5使用的是Razor的第三版本，波浪号当出现在script、style和img元素的src特性时就会被自动解析.
<script src="~/***.js" type="text/javascript"></scritp>

3、Html.Partial和Html.RenderPartial

Partial辅助方法用于将部分视图渲染成字符串。

4、Html.Action和Html.RenderAction

强烈推荐学习下载：MvcMusicStore源码学习

推荐阅读：

【C# - Entity Framework】无法检索"xxxxx"的元数据

HtmlHelper用法大全2：TextBox、Password、TextArea、RadioButton、CheckBox

HtmlHelper用法大全3:Html.LabelFor、Html.EditorFor、Html.RadioButtonFor、Html.CheckBoxFor

HtmlHelper用法大全