在视图中可以直接写Html,也可以使用HtmlHelper来创建。
例如:
<% = Html.TextBox( " tbxname " ) %>
页面源码:
< input id ="tbxname" name ="tbxname" type ="text" value ="" />
ViewPage的Html属性就是一个HtmlHelper类型的属性。它的用于创建Html的一些方法例如:TextBox,是通过扩展方法来实现。
FormExtensions Represents support for HTML in an application.
InputExtensions Represents support for HTML input controls in an application.
LinkExtensions Represents support for HTML links in an application.
RenderPartialExtensions Provides support for rendering a partial view.
SelectExtensions Represents support for making selections in a list.
TextAreaExtensions Represents support for HTML textarea controls.
ValidationExtensions Provides support for validating the input from an HTML form.
它们位于System.Web.Mvc.Html
(一)InputExtensions
它能创建5种类型的Html控件(返回5种类型的Html控件的字符串)。
·CheckBox
·RadioButton
·TextBox
·Password
·Hidden
每一种有多个重载,用于满足不同参数。
以TextBox为例。
public static string TextBox( this HtmlHelper htmlHelper, string name, object value);
public static string TextBox( this HtmlHelper htmlHelper, string name, object value, Dictionary < string , object > htmlAttributes);
public static string TextBox( this HtmlHelper htmlHelper,
string name, object value, object htmlAttributes);
这个方法首先调用:
public static string TextBox(this HtmlHelper htmlHelper, string name)这个方法,然后最终调用:
object value,IDictionary < string , object > htmlAttributes)
{
return htmlHelper.InputHelper(InputType.Text, name, value, (value == null ),
false , true , true , htmlAttributes);
}
然后调用:htmlHelper.InputHelper这个方法。
以TextBox来示例:
(1) 基本
(2) 添加css
(3)绑定
现在不提供强类型,以一个ViewData为例
(二)FormExtensions
它用于显示Form。有三种。
·BeginForm
·BeginRouteForm
·EndForm
其中,BeginRouteForm是以路由方式提交表单。
例如:
" Detail " ,
" {controller}/{action}/{id} " ,
new { Controller = " News " , action = " Detail " , id = 2 },
new { id = new SelfConstraint()}
);
这是一个路由,然后:
< div class ="divMargin" >
< span class ="spanHeader" > 用户帐号: </ span >
<% = Html.TextBox( " tbxUserId " ) %>
</ div >
< div class ="divMargin" >
< span class ="spanHeader" > 用户密码: </ span >
<% = Html.Password( " tbxUserPW " ) %>
</ div >
< div class ="divMargin" >
< input type ="submit" value ="登录" />
</ div >
<% } %>
其中的Detail 是路由的名称。
BeginForm可以用using的方法关闭form,来代替EndForm
再写一个BeginForm的例子:
< div class ="divMargin" >
< span class ="spanHeader" > 用户帐号: </ span >
<% = Html.TextBox( " tbxUserId " ) %>
</ div >
< div class ="divMargin" >
< span class ="spanHeader" > 用户密码: </ span >
<% = Html.Password( " tbxUserPW " ) %>
</ div >
< div class ="divMargin" >
< input type ="submit" value ="登录" />
</ div >
<% Html.EndForm(); %>
注意的是,开始与结束没有等号,且,都有分号结束符。
(三)LinkExtensions
用于提供html链接,有两种方法:
·ActionLink
·RouteLink
每一类方法有多种重载。
这是ActionLink的一个方法,它可以链接到同控制器下的某一动作中。
例如:
然后,传递参数:
下面是一个RouteLink的方法
<% = Html.RouteLink( " 到新闻详细页 " , new { action = " Detail " , id = 2 }) %>
(四)自定义HtmlHelper
自定义一个Label
{
public static string Label( string target, string text)
{
return String.Format( " <label id='{0}'>{1}</label> " , target, text);
}
}
在使用时:要添加名字空间进来:
然后这样使用:
为了和HtmlHelper提供的控件一致,扩展一下HtmlHelper,以一个span为例:
{
public static string Span( this HtmlHelper helper, string strId, string strContent)
{
return string .Format( " <span id=\ " { 0 }\ " >{1}</span> " , strId, strContent);
}
}
使用:
同样也要引用空间,然后:
(五) TagBuilder
在自定义HtmlHelper时,可以通过TagBuilder来创建。下边列出几个常用的方法:
public void GenerateId( string name);
public void SetInnerText( string innerText);
public void MergeAttribute( string key, string value);
现在还是来创建一个span:
string strcontent, string strClass)
{
TagBuilder builder = new TagBuilder( " span " );
builder.GenerateId(strId);
builder.SetInnerText(strcontent);
builder.AddCssClass(strClass);
builder.MergeAttribute( " title " , " span! " );
return builder.ToString();
}
使用:
源码: