标签：
HTML辅助方法（html helper）是用来帮助生成HTML的方法。
1、HTML辅助方法应用实例
◊ 生成form元素
@using (Html.BeginForm("About", "Home")) {
@Html.TextBox("ProductName")
}
生成的html代码如下：
<form method="post" action="/Home/About"> <input id="ProductName" type="text" value="" name="ProductName"> </form>
◊ 生成TextBox元素
@Html.TextBox("ProductName", "产品名称", new { id = "txtProductName", @class = "txt" })
public static MvcHtmlString TextBox(this HtmlHelper htmlHelper, string name, object value, object htmlAttributes);
生成html代码如下：
<input id="txtProductName" class="txt" type="text" value="产品名称" name="ProductName">
@Html.TextBox("ProductName", "产品名称", ViewBag.Attributes as IDictionary<string, object>)
public static MvcHtmlString TextBox(this HtmlHelper htmlHelper, string name, object value, IDictionary<string, object> htmlAttributes);
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Collections;
namespace MvcTest.Controllers
{
public class HomeController : Controller
{
//
// GET: /Home/
public ActionResult Index()
{
IDictionary<string, object> attr = new Dictionary<string, object>();
attr.Add("id", "txtProductName");
attr.Add("style", "border:1px solid #666666;");
attr.Add("class", "txt");
ViewBag.Attributes = attr;
return View();
}
}
}
生成的html代码：
<input id="txtProductName" class="txt" type="text" value="产品名称" style="border:1px solid #666666;" name="ProductName">
◊ 生成DropDownList
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Collections;
namespace MvcTest.Controllers
{
public class HomeController : Controller
{
//
// GET: /Home/
public ActionResult Index()
{
List<SelectListItem> lst = new List<SelectListItem>();
lst.Add(new SelectListItem { Text = "数码电子", Value = "1" });
lst.Add(new SelectListItem { Text = "服装服饰", Value = "2" });
lst.Add(new SelectListItem { Text = "珠宝首饰", Value = "3" });
ViewBag.Category = lst;
ViewBag.Category = new SelectList(lst, "Value", "Text", "2");
return View();
}
}
}
@Html.DropDownList("Category", "请选择")
生成的HTML代码：
<select id="Category" name="Category">
<option value="">请选择</option>
<option value="1">数码电子</option>
<option selected="selected" value="2">服装服饰</option>
<option value="3">珠宝首饰</option>
</select>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Collections;
namespace MvcTest.Controllers
{
public class HomeController : Controller
{
//
// GET: /Home/
public ActionResult Index()
{
List<Models.Province> lst = new List<Models.Province>();
lst.Add(new Models.Province { ProvinceID = 1, ProvinceNo = "100000", ProvinceName = "北京" });
lst.Add(new Models.Province { ProvinceID = 2, ProvinceNo = "110000", ProvinceName = "上海" });
lst.Add(new Models.Province { ProvinceID = 3, ProvinceNo = "120000", ProvinceName = "深圳" });
ViewBag.Category = new SelectList(lst, "ProvinceNo", "ProvinceName", "110000");
return View();
}
}
}
2、自定义HTML辅助方法
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Routing;
using System.Web.Mvc;
namespace MvcTest.html
{
public static class HtmlExtensions
{
public static MvcHtmlString Img(this HtmlHelper htmlHelper, string src)
{
return Img(htmlHelper, String.Empty, src, String.Empty, null);
}
public static MvcHtmlString Img(this HtmlHelper htmlHelper, string id, string src)
{
return Img(htmlHelper, id, src, String.Empty, null);
}
public static MvcHtmlString Img(this HtmlHelper htmlHelper, string id, string src, string alt, object htmlAttributes)
{
TagBuilder builder = new TagBuilder("img");
builder.GenerateId(id);
builder.MergeAttribute("src", src);
builder.MergeAttribute("alt", alt);
builder.MergeAttributes(new RouteValueDictionary(htmlAttributes));
return MvcHtmlString.Create(builder.ToString(TagRenderMode.SelfClosing));
}
}
}
@{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Layout.cshtml";
}
@using MvcTest.html
@Html.Img("", Url.Content("~/Content/logo.png"))
@Html.Img("imgLogo", Url.Content("~/Content/logo.png"), "Logo", new { border = "1px solid #666666", @class = "c01" })
生成的HTML代码：
<img src="/Content/logo.png" /> <img alt="Logo" border="1px solid #666666" class="c01" id="imgLogo" src="/Content/logo.png" />
标签：
原文地址：http://www.cnblogs.com/zengpeng/p/5756235.html
