HtmlHelper解析（二） -- 代码梦工厂-- 编程爱好者博客

1.表单

使用HtmlHelper的扩展类FormExtensions来生成Form，这里重点介绍BeginForm方法，它有13个重载方法，通过重载方法为表单添加属性，像action，method，id，enctype等属性。下面我们用其中一个方法来生成表单：

view plaincopy to clipboardprint?00.<%using(Html.BeginForm("action","controllName", FormMethod.Post)){ %> 00. <%} %>

生成结果

view plaincopy to clipboardprint?
00.<form action="/controllName/action" method="post"></form>

2.表单元素

a.来看一下InputExtensions类中的一些生成元素的常方法，其中每个方法都有重载方法:
• CheckBox方法: 返回复选框 input 元素
•        Hidden方法:返回隐藏的 input 元素
•        Password方法:返回密码 input 元素
• RadioButton方法:返回用于呈现互斥选项的单选按钮 input 元素
• TextBox方法:返回文本 input 元素

     直接上例子：

view plaincopy to clipboardprint?
00.<%using (Html.BeginForm("action", "controllName", FormMethod.Post))
00.          { %>
00.        姓名:<%:Html.TextBox("txtName") %><br />
00.        密码:<%:Html.Password("txtPwd") %><br />
00.        性别: <label> 男<%: Html.RadioButton("grp1", "男", true, new { id = "rbtnBoy" })%></label><label>女<%: Html.RadioButton("grp1", "女", false, new { id = "rbtnGril" })%></label> <br />
00.        爱好:<label>游泳<%: Html.CheckBox("chkA") %> </label> <label> 看书<%: Html.CheckBox("chkB") %> </label> <label> 睡觉<%: Html.CheckBox("chkC") %> </label><br />
00.             <label>看电视<%: Html.CheckBox("chkD") %> </label> <label>上网 <%: Html.CheckBox("chkE") %> </label> <label> 购物<%: Html.CheckBox("chkF") %> </label><br />
00.        <%} %>

结果:

html源码：

view plaincopy to clipboardprint?
00.<form action="/controllName/action" method="post">
00.        姓名:<input id="txtName" name="txtName" type="text" value="" /><br />
00.        密码:<input id="txtPwd" name="txtPwd" type="password" /><br />
00.        性别: <label> 男<input checked="checked" id="rbtnBoy" name="grp1" type="radio" value="男" /></label><label>女<input id="rbtnGril" name="grp1" type="radio" value="女" /></label> <br />
00.        爱好:<label>游泳<input id="chkA" name="chkA" type="checkbox" value="true" /><input name="chkA" type="hidden" value="false" /> </label> <label> 看书<input id="chkB" name="chkB" type="checkbox" value="true" /><input name="chkB" type="hidden" value="false" /> </label> <label> 睡觉<input id="chkC" name="chkC" type="checkbox" value="true" /><input name="chkC" type="hidden" value="false" /> </label><br />
00.             <label>看电视<input id="chkD" name="chkD" type="checkbox" value="true" /><input name="chkD" type="hidden" value="false" /> </label> <label>上网 <input id="chkE" name="chkE" type="checkbox" value="true" /><input name="chkE" type="hidden" value="false" /> </label> <label> 购物<input id="chkF" name="chkF" type="checkbox" value="true" /><input name="chkF" type="hidden" value="false" /> </label><br />
00.        </form>

b.LinkExtensions类
•ActionLink方法：返回包含指定操作的虚拟路径的定位点元素（a元素）
•RouteLink方法： An anchor element (a element)

例子：

view plaincopy to clipboardprint?
00.<%: Html.ActionLink("点我跳转到其它页面","actionName") %><br />
00. <%: Html.ActionLink("点我跳转到其它页面","actionName","controllerName") %><br />
00. <%: Html.RouteLink("点我跳转到其它页面", new { controller = "Home", action = "List" }, new { id = "link1", @class = "link_hover" })%>

生成html代码：

view plaincopy to clipboardprint?
00.a href="/Home/actionName">点我跳转到其它页面</a><br />
00. <a href="/controllerName/actionName" mce_href="controllerName/actionName">点我跳转到其它页面</a><br />
00. <a class="link_hover" href="/Home/List" mce_href="Home/List" id="link1">点我跳转到其它页面</a>

c.ChildActionExtensions类,包括下面两个方法，每个方法都有六个重载函数
•Action方法：使用指定的參數叫用指定的子系動作方法，並以 HTML 字串形式傳回結果。把目标页镶嵌在本页中
•RenderAction方法：无返回值的方法，也是把目标页镶嵌在本页中

假如在同一个controller下有a，b两个action

如果在a页面上调用 <%:Html.Action("b")%>或者<% Html.RenderAction("b"); %>,哪么显示出来的结果将是b页面镶嵌在a页面中。

下面用例子来验证上面的结果：

在HomeController类中有两个actin，分别是a方法和b方法。

view plaincopy to clipboardprint?
00.public class HomeController : Controller
00. {
00.      public ActionResult a()
00.      {
00.          return View();
00.      }
00.      public ActionResult b()
00.      {
00.          return View();
00.      }
00. }

下面分别是a页面和b页面中的代码：

view plaincopy to clipboardprint?00.<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" %> 00.<!DOCTYPE html> 00.<html> 00.<head runat="server"> 00.    <title>a</title> 00.</head> 00.<body> 00.    <div> 00.        这是a页面 00.        <%:Html.Action("b") %> 00.    </div> 00.</body> 00.</html> 00.－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－ 00.<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" %> 00.<!DOCTYPE html> 00.<html> 00.<head runat="server"> 00.    <title>b</title> 00.</head> 00.<body> 00.    <div> 00.        这是b页面 00.    </div> 00.</body> 00.</html>

在浏览器中输入：http://localhost:12151/home/a 结果如下：（这里会把b页面中html代码全部放入到a页码中）

这是a页面

这是b页面

在浏览器中输入：http://localhost:12151/home/b 结果如下：

这是b页面

由结果可知：<%:Html.Action("b") %>处的代码把页面中的内容显示到了a页面中.

d:PartialExtensions类，这个类比较简单，是把用户自定义控键呈现在页面上，只有一个方法
•Partial方法：这个方法有4个重载，都很简单

调用这个方法的时候真接把用户自定义好的控键()的名字传入方法中既可：如<%:Html.Partial("partialViewName")%>

这些就会把这个控键的内容在父页面上显示出来了。很简单，大家可以去试一下。

e:SelectExtensions类
•DropDownList方法
•ListBox方法

对于上面两个方法，一看名字就知道是干啥用的，就不细说了。。

DropDownList小例：

view plaincopy to clipboardprint?00.<%: Html.DropDownList("国家", new SelectListItem[] { 00. new SelectListItem() { Text = "中国", Value = "中国" }, 00. new SelectListItem() { Text = "印度", Value = "印度" }, 00. new SelectListItem() { Text = "鹅国", Value = "鹅国" }, 00. new SelectListItem() { Text = "钱国", Value = "钱国" }, 00. new SelectListItem() { Text = "钱国", Value = "钱国" }, 00. new SelectListItem() { Text = "钱国", Value = "钱国" }, 00. new SelectListItem() { Text = "钱国", Value = "钱国" }} 00. )%> 00. <%: Html.ListBox("国家", new SelectListItem[] { 00. new SelectListItem() { Text = "中国", Value = "中国" }, 00. new SelectListItem() { Text = "印度", Value = "印度" }, 00. new SelectListItem() { Text = "鹅国", Value = "鹅国" }, 00. new SelectListItem() { Text = "钱国", Value = "钱国" }, 00. new SelectListItem() { Text = "钱国", Value = "钱国" }, 00. new SelectListItem() { Text = "钱国", Value = "钱国" }, 00. new SelectListItem() { Text = "钱国", Value = "钱国" }} 00. )%>

结果图:

生成Html源码：

view plaincopy to clipboardprint?00. <select name="国家"><option value="中国">中国</option> 00.<option value="印度">印度</option> 00.<option value="鹅国">鹅国</option> 00.<option value="钱国">钱国</option> 00.<option value="钱国">钱国</option> 00.<option value="钱国">钱国</option> 00.<option value="钱国">钱国</option> 00.</select> 00. 00. <select multiple="multiple" name="国家"><option value="中国">中国</option> 00.<option value="印度">印度</option> 00.<option value="鹅国">鹅国</option> 00.<option value="钱国">钱国</option> 00.<option value="钱国">钱国</option> 00.<option value="钱国">钱国</option> 00.<option value="钱国">钱国</option> 00.</select>

些外还有其它一些扩展类，像

TextAreaExtensions,ValidationExtensions等。。

完成任务

本文来自CSDN博客，转载请标明出处：http://blog.csdn.net/wanggang421338916/archive/2011/04/06/6304115.aspx

博客介绍

正文

HtmlHelper解析（二）2011-05-05 13:59:00

评论

博客介绍

正文

HtmlHelper解析 （二）2011-05-05 13:59:00

评论

HtmlHelper解析（二）2011-05-05 13:59:00