MVC框架——页面开发辅助类HtmlHelper

MVC框架——页面开发辅助类HtmlHelper

1. 为什么要使用页面开发辅助类HtmlHelper，与传统手写标签方式比较

手写Html标签效率较低，可重用度较低:
传统标签要根据路由规则来写，路由修改则这种书写方式也得进行修改

在Index视图中：
一般情况下使用标签的方式：

<a href="/Home/About?name=tom" style="color:aqua">跳转到About</a>

还有两种方式可以实现标签：
1.1 通过url内置对象的方法action()实现
这里的action有9个重载方法

<a href="@Url.Action("about","home",new { name = "tom"})">通过url跳转到About</a>
<a href="@Url.Action("about")">通过url跳转，此时跳转的控制器就是当前视图默认所属的控制器</a>
        public virtual string Action(
        string actionName,
         string controllerName, 
         object routeValues);
<hr/>

url内置对象的方法action()：
使用指定的操作名称、控制器名称和路由值生成操作方法的完全限定 URL。
参数:
actionName: 操作方法的名称
controllerName: 控制器的名称
routeValues: 一个包含路由参数的对象。通过检查对象的属性，利用反射检索参数。该对象通常是使用对象初始值设定项语法创建的
返回结果: 操作方法的完全限定 URL

1.2 使用HtmlHelper辅助类对象Html中avtionlink()方法实现页面跳转

@Html.ActionLink("通过html跳转到about","about","home",new { name = "tom"},new { style = "color:aqua"})
@Html.ActionLink("通过html跳转到about", "about", "home")
@Html.ActionLink("通过html跳转到about", "about", "home", new { name = "tom" })

此时，ActionLink为Html类的扩展方法
扩展方法：为某一个类去新增一个方法
Html.ActionLink()也有9个重载方法
常用的有：Html.ActionLink（想要在链接展现的文本信息，action名称，控制器名称，页面传递的值，为a标签添加的属性）

2. HtmlHelper 部分常见方法使用详解

2.1 TextArea（）

TextArea(string name, string value,  int rows, int columns,object htmlAttributes);
//TextArea(控件的id/name, 控件显示文本,显示的行数，显示的列数，属性) 如：
@Html.TextArea("ta","请输入内容",5,10,new { style = "color:blue"})

运行结果：

2.2 TextBox( )

public static MvcHtmlString TextBox( string name, object value, object htmlAttributes);
//TextBox(控件的id/name, 控件显示文本,属性) 如：
@Html.TextBox("username","请输入姓名",new { style = "color:aquamarine",@class="danger" })
//当html代码与c#关键词相同时，如这里的class，需要再在这个词前面加上艾特符号，使系统辨识到它是html代码，而不是关键词

运行效果：

2.3 Password（）

public static MvcHtmlString Password(this HtmlHelper htmlHelper, string name);
@Html.Password("pwd")

运行效果

2.4 CheckBox（）

public static MvcHtmlString CheckBox(this HtmlHelper htmlHelper, string name, bool isChecked, object htmlAttributes);
<p>
    性别
</p>
<p>
    女 @Html.CheckBox("check1", true, new { style = "color:blue" })
</p>
<p>
    男 @Html.CheckBox("check1", false, new { style = "color:blue" })
</p>

运行效果：


2.5 为下拉列表制造选项集合

controller里：
Index(){
//先创造一个集合
List<SelectListItem> list= new List<SelectListItem>();
SelectListItem s1= new SelectListItem(){
Seleted = true,
Text="Beijing",
Value ="1"};
SelectListItem s2= new SelectListItem(){
Seleted = false,
Text="Shanghai",
Value ="2"};
SelectListItem s3= new SelectListItem(){
Seleted = false,
Text="Guangdong",
Value ="3"};
list.Add(s1);
list.Add(s2);
list.Add(s3);
//此时集合list中就添加三个选项的信息
ViewData["data"] = list;
return View();
}

html里,第一种方法：
@{
List<SelectListItem> list=ViewData["data"] as  List<SelectListItem>();
}
@Html.DropDownList("dd"名字,list要传进去的list集合)

html里,第二种方法：
通过viewdata的键获取传递过来的值，这里dropdonwlist会自动完成数据装配
自动装配：MVC特有的技术，将viewdata和viewbag传递过来的数据自动加载到标签的属性上
@Html.DropDownList("data")

controller里简化写法：
ViewData["data"] = new List<SelectListItem>(){
new List<SelectListItem>() {Seleted = true,Text="Beijing",Value ="1"}
new List<SelectListItem>() {Seleted = false,Text="Shanghai",Value ="2"}
new List<SelectListItem>() {Seleted = false,Text="Guangdong",Value ="3"}
};

SelectListItem(Selected选项是否是选中状态，Text显示文本，Value选中这个对象之后返回的值)

• Displayfor 与TextBoxfor的区别：

Displayfor是只读，TextBoxfor是可修改

Hidden(),Hiddenfor()：
隐藏域，在页面上不显示信息，但可以携带数据

结尾带For的才用LAMDA表达式：

 @Html.Hidden("namexxx",Model.id)
 @Heml.HiddenFor(t=>t.Id)//此时默认把t.id的这个Id属性当作产生的input属性和名称
<input id="Id" name="Id">