一步步学习ASP.NET MVC3 (13)——HTML辅助方法

时间:2021-02-03 15:25:48

请注明转载地址:http://www.cnblogs.com/arhat

今天老魏是在十分郁闷,我的一个U盘丢了,心疼里面的资料啊,全部是老魏辛辛苦苦积攒的Linux资料,太心疼,到现在心情还不是很爽。没办法,丢了也就丢了。希望老魏能够从服务器中找到这些备份的资料吧。

那么开始今天的章节,由于前两天比较忙,老魏更新的慢了,以后慢慢不上来吧!今天我们要说的是ASP.NET MVC 中的HTML辅助方法。HTML辅助方法能够帮助我们能够快速生成视图代码,通过HTML辅助方法可以向像编写C#一样编写HTML文件。

这些辅助方法都位于System.Web.Mvc.Html这个命名空间,大家可以从这个命名空间中查看这些方法。当了,由于这些辅助方法只是用来生成html内容的,所以老魏这里呢就不再详细的介绍,根据下面我举的例子,大家可以依葫芦画瓢看着帮助文档来学习。

而HTML辅助方法是HTMLHelper类的扩展方法,所以本章我们主要来看看这些辅助方法是如何帮助我们快速的开发视图文件。

一、超链接
HTMLHelper的扩展方法提供以下的扩展方法可以生成超链接。

public static MvcHtmlString ActionLink(this HtmlHelper htmlHelper, string linkText, string actionName);        

public static MvcHtmlString ActionLink(this HtmlHelper htmlHelper, string linkText, string actionName, object routeValues);        

public static MvcHtmlString ActionLink(this HtmlHelper htmlHelper, string linkText, string actionName, RouteValueDictionary routeValues);        

public static MvcHtmlString ActionLink(this HtmlHelper htmlHelper, string linkText, string actionName, string controllerName);        

public static MvcHtmlString ActionLink(this HtmlHelper htmlHelper, string linkText, string actionName, object routeValues, object htmlAttributes);

这么多重载方法我们并不需要全部的记住,而是在适当的时候使用适当的方法。我们来学习一下常用的方法。

public static MvcHtmlString ActionLink(this HtmlHelper htmlHelper, string linkText, string actionName);

这个方法是用来跳转到对应的action。

@Html.ActionLink("这是超连接", "Index");
<a href="/">这是超连接</a>

但是需要注意的是的,actionName只能是视图所在的控制下的Action方法。

public static MvcHtmlString ActionLink(this HtmlHelper htmlHelper, string linkText, string actionName, object routeValues);

这个方法生成的超连接可以传递一下参数。

@Html.ActionLink("这是超连接", "Index", new { id=1,name="department"});
<a href="/Home/Index/1?name=department">这是超连接</a>
public static MvcHtmlString ActionLink(this HtmlHelper htmlHelper, string linkText, string actionName, string controllerName);

这个方法生成的连接可以跨controller

@Html.ActionLink("这是超连接", "Test","About");
<a href="/About/Test">这是超连接</a>;
public static MvcHtmlString ActionLink(this HtmlHelper htmlHelper, string linkText, string actionName, string controllerName,object routeValues, object htmlAttributes);
@Html.ActionLink("这是超连接", "Test", "About", new { name="apple"},null);
<a href="/About/Test?name=apple">这是超连接</a>;

我们可以通过最后一个参数来给html元素添加属性。

@Html.ActionLink("这是超连接", "Test", "About", new { name = "apple" }, new { style="text-decoration:none"});
<a href="/About/Test?name=apple" style="text-decoration:none">这是超连接</a>;

这里需要注意的地方是如果要给超链接添加一个class的css属性,那么必须在前面加上@符号,因为class是C#的关键字。

@Html.ActionLink("这是超连接", "Test", "About", new { name = "apple" }, new { style="text-decoration:none",@class="a"});
<a class=”a” href="/About/Test?name=apple" style="text-decoration:none">这是超连接</a>;

表单
当然除了超链接,HTML辅助方法也提供了对表单的支持。如果我们使用辅助方法来生成表单可以通过两种方法,只是风格不同。

通过Html.BeginForm()方法来声明一个表单。又有BeginForm方法的重载比较多,这里就不一一列举了,我们来看一下常用的重载方法。大家可以从System.Web.Mvc.Html.FormExtensions中查看一下重载的方法。

@using (Html.BeginForm()) 

{ 

<p>

        账号:@Html.TextBox("username")

</p>

<p>

        密码:@Html.Password("pwd")

</p>

}
<form action="/" method="post">   

 <p>        账号:<input id="username" name="username" type="text" value="" />    </p>   

 <p>        密码:<input id="pwd" name="pwd" type="password" />    </p>

</form>

那么我们可以看到生成的表单中action的地址为”/”。所以我们可以通过其他的重载函数来生成表单。

@using (Html.BeginForm("Test","Home")) 

{ 

<p>

        账号:@Html.TextBox("username")

</p>

<p>

        密码:@Html.Password("pwd")

</p>

}
<form action="/Home/Test" method="post">   

 <p>        账号:<input id="username" name="username" type="text" value="" />    </p>    

<p>        密码:<input id="pwd" name="pwd" type="password" />    </p>

</form>

在上面的例子中,我们使用到了表单元素,那么这些表单元素大家可以从System.Web.Mvc.HtmlInputExtensions中查看,这里老魏就不再做介绍了(因为比较简单)。