HTMLhelper

使用 HTML 帮助器在 ASP.NET MVC 中呈现窗体

.NET Framework 4

ASP.NET MVC 框架包含帮助器方法，通过使用这些帮助器方法，可以轻松地在视图中呈现 HTML。 本主题介绍如何使用最常用的 HTML 帮助器。 最后一节演示了一个示例，该示例包括本主题中描述的 HTML 帮助器。

可用的 HTML 帮助器

---

以下列表显示了当前可用的一些 HTML 帮助器。 本主题演示所列出的带有星号 (*) 的帮助器。

• ActionLink - 链接到操作方法。

• BeginForm * - 标记窗体的开头并链接到呈现该窗体的操作方法。

• CheckBox * - 呈现复选框。

• DropDownList * - 呈现下拉列表。

• Hidden - 在窗体中嵌入未呈现的信息以供用户查看。

• ListBox * - 呈现列表框。

• Password - 呈现用于输入密码的文本框。

• RadioButton * - 呈现单选按钮。

• TextArea - 呈现文本区域（多行文本框）。

• TextBox * - 呈现文本框。

使用 BeginForm 帮助器

---

BeginForm 帮助器标记 HTML 窗体的开头并呈现为 HTML form 元素。 BeginForm 帮助器方法具有多个重写。 以下示例中显示的 BeginForm 帮助器的版本采用两个参数，即操作方法的名称和用于提交窗体的控制器。 BeginForm 帮助器可实现 IDisposable 接口，这使您可以像使用 ASP.NET AJAX 那样使用 using 关键字（Visual Basic 中的 Using）。

下面的示例演示如何在 using 模式中使用 BeginForm 帮助器。

VB

C#

C++

F#

JScript

<% using(Html.BeginForm("HandleForm", "Home")) %>
<% { %>
    <!-- Form content goes here -->
<% } %>

您也可以以声明方式使用 BeginForm 帮助器。 以声明方式使用 BeginForm 与使用 HTML form 标记的不同之处在于：BeginForm 会为操作方法和操作特性分配默认值，从而简化标记。 下面的示例使用声明性标记来标记窗体的开头和结尾。

VB

C#

C++

F#

JScript

<% Html.BeginForm(); %>
    <!-- Form content goes here -->
<% Html.EndForm(); %>

使用 CheckBox 帮助器

---

CheckBox 帮助器方法将呈现一个具有您指定的名称的复选框。 呈现的控件将返回一个布尔值（true 或 false）。 下面的示例演示 CheckBox 帮助器方法的标记。

<%= Html.CheckBox("bookType") %>

使用 DropDownList 帮助器

---

DropDownList 帮助器将呈现下拉列表。 最简单的 DropDownList 采用一个参数，即值类型为 SelectList 且包含下拉列表选项值的 ViewData 关键字的名称。 MVC 框架使用 ViewData 的ModelState 属性来确定选定的值。 如果 ModelState 属性为空，则该框架将查找已设置了其 Selected 属性的项。

下面的示例演示 DropDownList 帮助器方法的标记。

<%= Html.DropDownList("pets") %>

注意
DropDownList 和 ListBox 帮助器均接受 SelectList 或 MultiSelectList 对象。

下面的代码是用于向 List 对象添加值的 Index 操作方法的一部分。 List 对象将传递给 SelectList 的实例，然后后者会添加到 ViewData 对象中。

VB

C#

C++

F#

JScript

List<string> petList = new List<string>();
petList.Add("Dog");
petList.Add("Cat");
petList.Add("Hamster");
petList.Add("Parrot");
petList.Add("Gold fish");
petList.Add("Mountain lion");
petList.Add("Elephant");

ViewData["Pets"] = new SelectList(petList);

使用 RadioButton 帮助器

---

RadioButton 帮助器方法将呈现单选按钮。 该方法最简单的形式是采用以下三个参数：控件组的名称、选项值以及用于确定单选按钮最初是否处于选定状态的 Boolean 值。 下面的标记演示RadioButton 帮助器方法的标记。

Select your favorite color:<br />
<%= Html.RadioButton("favColor", "Blue", true) %> Blue <br />
<%= Html.RadioButton("favColor", "Purple", false)%> Purple <br />
<%= Html.RadioButton("favColor", "Red", false)%> Red <br />
<%= Html.RadioButton("favColor", "Orange", false)%> Orange <br />
<%= Html.RadioButton("favColor", "Yellow", false)%> Yellow <br />
<%= Html.RadioButton("favColor", "Brown", false)%> Brown <br />
<%= Html.RadioButton("favColor", "Green", false)%> Green

使用 TextBox 帮助器

---

TextBox 帮助器方法将呈现一个具有指定名称的文本框。 下面的标记演示 TextBox 帮助器方法的标记。

Enter your name: <%= Html.TextBox("name") %>

示例应用程序

---

下面的示例是上述示例所摘自的完整示例。 Index 页显示了一个实现 HTML 帮助器方法的窗体。 当用户提交窗体时，窗体由 HandleForm 操作方法进行处理，从而生成一个显示用户提交的信息的视图。

下面的示例演示 HomeController 类。

VB

C#

C++

F#

JScript

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace MvcHtmlHelpers.Controllers
{
    [HandleError]
    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            ViewData["Message"] = "Welcome to ASP.NET MVC!";

            List<string> petList = new List<string>();
            petList.Add("Dog");
            petList.Add("Cat");
            petList.Add("Hamster");
            petList.Add("Parrot");
            petList.Add("Gold fish");
            petList.Add("Mountain lion");
            petList.Add("Elephant");

            ViewData["Pets"] = new SelectList(petList);

            return View();
        }

        public ActionResult About()
        {
            return View();
        }

        public ActionResult HandleForm(string name, string favColor, Boolean bookType, string pets)
        {
            ViewData["name"] = name;
            ViewData["favColor"] = favColor;
            ViewData["bookType"] = bookType;
            ViewData["pet"] = pets;

            return View("FormResults");
        }
    }
}

下面的示例演示 Index 视图。

VB

C#

C++

F#

JScript

<h2><%= Html.Encode(ViewData["Message"]) %></h2>
<br /><br />
<% using(Html.BeginForm("HandleForm", "Home")) %>
<% { %>
    Enter your name: <%= Html.TextBox("name") %>
    <br /><br />
    Select your favorite color:<br />
    <%= Html.RadioButton("favColor", "Blue", true) %> Blue <br />
    <%= Html.RadioButton("favColor", "Purple", false)%> Purple <br />
    <%= Html.RadioButton("favColor", "Red", false)%> Red <br />
    <%= Html.RadioButton("favColor", "Orange", false)%> Orange <br />
    <%= Html.RadioButton("favColor", "Yellow", false)%> Yellow <br />
    <%= Html.RadioButton("favColor", "Brown", false)%> Brown <br />
    <%= Html.RadioButton("favColor", "Green", false)%> Green 
    <br /><br />
    <%= Html.CheckBox("bookType") %> I read more fiction than non-fiction.<br />
    <br /><br />
    My favorite pet: <%= Html.DropDownList("pets") %>
    <br /><br />
    <input type="submit" value="Submit" />
<% } %>

下面的示例演示 FormResults 视图。

VB

C#

C++

F#

JScript

<h2>FormResults</h2>
<p>
Your name: <b><%= Html.Encode(ViewData["name"])%></b>
</p>
<p>
Your favorite color: <b><%= Html.Encode(ViewData["favColor"]) %></b>
</p>
<% if (ViewData["bookType"].Equals(true))
   { %>
<p>You read more <b>fiction</b> than non-fiction.</p>
<% }
   else
   { %>
<p>You read more <b>non-fiction</b> than fiction.</p>
<% } %>
Your favorite pet: <b><%= Html.Encode(ViewData["pet"]) %></b>