C# ASP.NET MVC HtmlHelper用法大全

C# ASP.NET MVC HtmlHelper用法大全

HTML扩展类的所有方法都有2个参数：

以textbox为例子

public static string TextBox( this HtmlHelper htmlHelper, string name, Object value, IDictionary<string, Object> htmlAttributes )

public static string TextBox( this HtmlHelper htmlHelper, string name, Object value, Object htmlAttributes )

这2个参数代表这个html标签的属性集合。使用方法如下。

 1.ActionLink

<%=Html.ActionLink( "这是一个连接" , "Index" , "Home" )%>   带有QueryString的写法   <%=Html.ActionLink( "这是一个连接" , "Index" , "Home" , new  { page=1 }, null )%>   <%=Html.ActionLink( "这是一个连接" , "Index" , new  { page=1 })%>   有其它Html属性的写法   <%=Html.ActionLink( "这是一个连接" , "Index" , "Home" , new  { id= "link1"  })%>   <%=Html.ActionLink( "这是一个连接" , "Index" , null , new  { id= "link1"  })%>   QueryString与Html属性同时存在   <%=Html.ActionLink( "这是一个连接" , "Index" , "Home" , new  { page = 1 }, new  { id = "link1"  })%>   <%=Html.ActionLink( "这是一个连接" , "Index"  , new  { page = 1 }, new  { id = "link1"  })%>        生成结果为：   <a href= "/" >这是一个连接</a>   带有QueryString的写法   <a href= "/?page=1" >这是一个连接</a>   <a href= "/?page=1" >这是一个连接</a>   有其它Html属性的写法   <a href= "/?Length=4"  id= "link1" >这是一个连接</a>   <a href= "/"  id= "link1" >这是一个连接</a>   QueryString与Html属性同时存在   <a href= "/?page=1"  id= "link1" >这是一个连接</a>   <a href= "/?page=1"  id= "link1" >这是一个连接</a>

 2.RouteLink

跟ActionLink在功能上一样。   <%=Html.RouteLink( "关于" , "about" , new  { })%>   带QueryString   <%=Html.RouteLink( "关于" , "about" , new  { page = 1 })%>   <%=Html.RouteLink( "关于" , "about" , new  { page = 1 }, new  { id = "link1"  })%>        生成结果：   <a href= "/about" >关于</a>   <a href= "/about?page=1" >关于</a>   <a href= "/about?page=1"  id= "link1" >关于</a>

 3.Form 2种方法

<% using (Html.BeginForm( "index" , "home" ,FormMethod.Post)){%> <%} %>     <%Html.BeginForm( "index" , "home" , FormMethod.Post); //注意这里没有=输出%>  <%Html.EndForm(); %>     生成结果： <form action= "/home/index"  method= "post" ></form>

 4.TextBox , Hidden ,

<%=Html.TextBox( "input1" ) %>   <%=Html.TextBox( "input2" ,Model.CategoryName, new { @style = "width:300px;"  }) %>   <%=Html.TextBox( "input3" , ViewData[ "Name" ], new { @style = "width:300px;"  }) %>   <%=Html.TextBoxFor(a => a.CategoryName, new  { @style = "width:300px;"  })%>        生成结果：        <input id= "input1"  name= "input1"  type= "text"  value= ""  />   <input id= "input2"  name= "input2"  style= "width:300px;"  type= "text"  value= "Beverages"  />   <input id= "input3"  name= "input3"  style= "width:300px;"  type= "text"  value= ""  />   <input id= "CategoryName"  name= "CategoryName"  style= "width:300px;"  type= "text"  value= "Beverages"  />

 5.TextArea

<%=Html.TextArea( "input5" , Model.CategoryName, 3, 9, null )%>   <%=Html.TextAreaFor(a => a.CategoryName, 3, 3, null )%>        生成结果：   <textarea cols= "9"  id= "input5"  name= "input5"  rows= "3" >Beverages</textarea>   <textarea cols= "3"  id= "CategoryName"  name= "CategoryName"  rows= "3" >Beverages</textarea>

 6.CheckBox

<%=Html.CheckBox( "chk1" , true ) %> <%=Html.CheckBox( "chk1" , new  { @ class = "checkBox" }) %> <%=Html.CheckBoxFor(a =>a.IsVaild, new  { @ class  = "checkBox"  })%>     生成结果：     <input checked = "checked"  id= "chk1"  name= "chk1"  type= "checkbox"  value= "true"  /><input name= "chk1"  type= "hidden"  value= "false"  />     <input class = "checkBox"  id= "chk1"  name= "chk1"  type= "checkbox"  value= "true"  /><input name= "chk1"  type= "hidden"  value= "false"  />     <input checked = "checked"  class = "checkBox"  id= "IsVaild"  name= "IsVaild"  type= "checkbox"  value= "true"  /><input name= "IsVaild"  type= "hidden"  value= "false"  />

7.ListBox

<%=Html.ListBox( "lstBox1" ,(SelectList)ViewData[ "Categories" ])%> <%=Html.ListBoxFor(a => a.CategoryName, (SelectList)ViewData[ "Categories" ])%>     生成结果： < select  id= "lstBox1"  multiple= "multiple"  name= "lstBox1" > <option value= "1" >Beverages</option> <option value= "2" >Condiments</option> <option selected= "selected"  value= "3" >Confections</option> <option value= "4" >Dairy Products</option> <option value= "5" >Grains/Cereals</option> <option value= "6" >Meat/Poultry</option> <option value= "7" >Produce</option> <option value= "8" >Seafood</option> </ select > < select  id= "CategoryName"  multiple= "multiple"  name= "CategoryName" > <option value= "1" >Beverages</option> <option value= "2" >Condiments</option> <option value= "3" >Confections</option> <option value= "4" >Dairy Products</option> <option value= "5" >Grains/Cereals</option> <option value= "6" >Meat/Poultry</option> <option value= "7" >Produce</option> <option value= "8" >Seafood</option> </ select >

 8.DropDownList

 

<%= Html.DropDownList( "ddl1" , (SelectList)ViewData[ "Categories" ], "--Select One--" )%>   <%=Html.DropDownListFor(a => a.CategoryName, (SelectList)ViewData[ "Categories" ], "--Select One--" , new  { @ class  = "dropdownlist"  })%>        生成结果：   < select  id= "ddl1"  name= "ddl1" >   <option value= "" >--Select One--</option>   <option value= "1" >Beverages</option>   <option value= "2" >Condiments</option>   <option selected= "selected"  value= "3" >Confections</option>   <option value= "4" >Dairy Products</option>   <option value= "5" >Grains/Cereals</option>   <option value= "6" >Meat/Poultry</option>   <option value= "7" >Produce</option>   <option value= "8" >Seafood</option>   </ select >   < select  class = "dropdownlist"  id= "CategoryName"  name= "CategoryName" >   <option value= "" >--Select One--</option>   <option value= "1" >Beverages</option>   <option value= "2" >Condiments</option>   <option value= "3" >Confections</option>   <option value= "4" >Dairy Products</option>   <option value= "5" >Grains/Cereals</option>   <option value= "6" >Meat/Poultry</option>   <option value= "7" >Produce</option>   <option value= "8" >Seafood</option>   </ select >

 9.Partial 视图模板

 

 

webform里叫自定义控件。功能都是为了复用。但使用上自定义控件真的很难用好。   <% Html.RenderPartial( "DinnerForm" ); %>  看清楚了没有等号的。 C# ASP.NET MVC HtmlHelper用法大全 HTML扩展类的所有方法都有2个参数： 以textbox为例子 public static string TextBox( this HtmlHelper htmlHelper, string name, Object value, IDictionary<string, Object> htmlAttributes ) public static string TextBox( this HtmlHelper htmlHelper, string name, Object value, Object htmlAttributes ) 这2个参数代表这个html标签的属性集合。使用方法如下。  1.ActionLink <%=Html.ActionLink( "这是一个连接" , "Index" , "Home" )%>   带有QueryString的写法   <%=Html.ActionLink( "这是一个连接" , "Index" , "Home" , new  { page=1 }, null )%>   <%=Html.ActionLink( "这是一个连接" , "Index" , new  { page=1 })%>   有其它Html属性的写法   <%=Html.ActionLink( "这是一个连接" , "Index" , "Home" , new  { id= "link1"  })%>   <%=Html.ActionLink( "这是一个连接" , "Index" , null , new  { id= "link1"  })%>   QueryString与Html属性同时存在   <%=Html.ActionLink( "这是一个连接" , "Index" , "Home" , new  { page = 1 }, new  { id = "link1"  })%>   <%=Html.ActionLink( "这是一个连接" , "Index"  , new  { page = 1 }, new  { id = "link1"  })%>        生成结果为：   <a href= "/" >这是一个连接</a>   带有QueryString的写法   <a href= "/?page=1" >这是一个连接</a>   <a href= "/?page=1" >这是一个连接</a>   有其它Html属性的写法   <a href= "/?Length=4"  id= "link1" >这是一个连接</a>   <a href= "/"  id= "link1" >这是一个连接</a>   QueryString与Html属性同时存在   <a href= "/?page=1"  id= "link1" >这是一个连接</a>   <a href= "/?page=1"  id= "link1" >这是一个连接</a>  2.RouteLink 跟ActionLink在功能上一样。   <%=Html.RouteLink( "关于" , "about" , new  { })%>   带QueryString   <%=Html.RouteLink( "关于" , "about" , new  { page = 1 })%>   <%=Html.RouteLink( "关于" , "about" , new  { page = 1 }, new  { id = "link1"  })%>        生成结果：   <a href= "/about" >关于</a>   <a href= "/about?page=1" >关于</a>   <a href= "/about?page=1"  id= "link1" >关于</a>  3.Form 2种方法 <% using (Html.BeginForm( "index" , "home" ,FormMethod.Post)){%> <%} %>     <%Html.BeginForm( "index" , "home" , FormMethod.Post); //注意这里没有=输出%>  <%Html.EndForm(); %>     生成结果： <form action= "/home/index"  method= "post" ></form>  4.TextBox , Hidden , <%=Html.TextBox( "input1" ) %>   <%=Html.TextBox( "input2" ,Model.CategoryName, new { @style = "width:300px;"  }) %>   <%=Html.TextBox( "input3" , ViewData[ "Name" ], new { @style = "width:300px;"  }) %>   <%=Html.TextBoxFor(a => a.CategoryName, new  { @style = "width:300px;"  })%>        生成结果：        <input id= "input1"  name= "input1"  type= "text"  value= ""  />   <input id= "input2"  name= "input2"  style= "width:300px;"  type= "text"  value= "Beverages"  />   <input id= "input3"  name= "input3"  style= "width:300px;"  type= "text"  value= ""  />   <input id= "CategoryName"  name= "CategoryName"  style= "width:300px;"  type= "text"  value= "Beverages"  />  5.TextArea <%=Html.TextArea( "input5" , Model.CategoryName, 3, 9, null )%>   <%=Html.TextAreaFor(a => a.CategoryName, 3, 3, null )%>        生成结果：   <textarea cols= "9"  id= "input5"  name= "input5"  rows= "3" >Beverages</textarea>   <textarea cols= "3"  id= "CategoryName"  name= "CategoryName"  rows= "3" >Beverages</textarea>  6.CheckBox <%=Html.CheckBox( "chk1" , true ) %> <%=Html.CheckBox( "chk1" , new  { @ class = "checkBox" }) %> <%=Html.CheckBoxFor(a =>a.IsVaild, new  { @ class  = "checkBox"  })%>     生成结果：     <input checked = "checked"  id= "chk1"  name= "chk1"  type= "checkbox"  value= "true"  /><input name= "chk1"  type= "hidden"  value= "false"  />     <input class = "checkBox"  id= "chk1"  name= "chk1"  type= "checkbox"  value= "true"  /><input name= "chk1"  type= "hidden"  value= "false"  />     <input checked = "checked"  class = "checkBox"  id= "IsVaild"  name= "IsVaild"  type= "checkbox"  value= "true"  /><input name= "IsVaild"  type= "hidden"  value= "false"  /> 7.ListBox <%=Html.ListBox( "lstBox1" ,(SelectList)ViewData[ "Categories" ])%> <%=Html.ListBoxFor(a => a.CategoryName, (SelectList)ViewData[ "Categories" ])%>     生成结果： < select  id= "lstBox1"  multiple= "multiple"  name= "lstBox1" > <option value= "1" >Beverages</option> <option value= "2" >Condiments</option> <option selected= "selected"  value= "3" >Confections</option> <option value= "4" >Dairy Products</option> <option value= "5" >Grains/Cereals</option> <option value= "6" >Meat/Poultry</option> <option value= "7" >Produce</option> <option value= "8" >Seafood</option> </ select > < select  id= "CategoryName"  multiple= "multiple"  name= "CategoryName" > <option value= "1" >Beverages</option> <option value= "2" >Condiments</option> <option value= "3" >Confections</option> <option value= "4" >Dairy Products</option> <option value= "5" >Grains/Cereals</option> <option value= "6" >Meat/Poultry</option> <option value= "7" >Produce</option> <option value= "8" >Seafood</option> </ select >  8.DropDownList   <%= Html.DropDownList( "ddl1" , (SelectList)ViewData[ "Categories" ], "--Select One--" )%>   <%=Html.DropDownListFor(a => a.CategoryName, (SelectList)ViewData[ "Categories" ], "--Select One--" , new  { @ class  = "dropdownlist"  })%>        生成结果：   < select  id= "ddl1"  name= "ddl1" >   <option value= "" >--Select One--</option>   <option value= "1" >Beverages</option>   <option value= "2" >Condiments</option>   <option selected= "selected"  value= "3" >Confections</option>   <option value= "4" >Dairy Products</option>   <option value= "5" >Grains/Cereals</option>   <option value= "6" >Meat/Poultry</option>   <option value= "7" >Produce</option>   <option value= "8" >Seafood</option>   </ select >   < select  class = "dropdownlist"  id= "CategoryName"  name= "CategoryName" >   <option value= "" >--Select One--</option>   <option value= "1" >Beverages</option>   <option value= "2" >Condiments</option>   <option value= "3" >Confections</option>   <option value= "4" >Dairy Products</option>   <option value= "5" >Grains/Cereals</option>   <option value= "6" >Meat/Poultry</option>   <option value= "7" >Produce</option>   <option value= "8" >Seafood</option>   </ select >  9.Partial 视图模板     webform里叫自定义控件。功能都是为了复用。但使用上自定义控件真的很难用好。   <% Html.RenderPartial( "DinnerForm" ); %>  看清楚了没有等号的。

转载于:https://www.cnblogs.com/zhangbin89021/p/4214562.html