(asp.net MVC学习)System.Web.Mvc.HtmlHelper学习及使用

在ASP.NET MVC框架中没有了自己的控件，页面显示完全就回到了写html代码的年代。还好在asp.net mvc框架中也有自带的HtmlHelper和UrlHelper两个帮助类。另外在MvcContrib扩展项目中也有扩展一些帮助类，这样我们就不光只能使用完整的html来编写了需要显示的页面了，就可以使用这些帮助类来完成，但最后运行时都还是要生成html代码的。

先来看看HtmlHelper能帮我们生成一些什么样的html呢。直接看效果吧。

     < div >
        1.使用HtmlHelper生成超链接:
         <% = Html.ActionLink( " 我是超链接 " , "" )  %>
         < br  />
        2.使用HtmlHelper生成表单:
         <%  Html.BeginForm( " Index " ,  " Simple " , FormMethod.Post,  new  { id  =   " myForm "  });  %>
         <%  Html.EndForm(); %>
         < br  />
        3.使用HtmlHelper根据路由规则生成表单:
         <%  Html.BeginRouteForm( new  { controller  =   " Simple " , action  =   " Demo "  });  %>
         <% Html.EndForm();  %>
         < br  />
        4.使用HtmlHelper生成一个复选框：
         <% =  Html.CheckBox( " checkBox " , new  { id = " myCheckBox "  }) %> 复选框
         < br  />
        5.使用HtmlHelper生成上拉列表框:
         <%  var dropList  =   new  List < SelectListItem > ();
            for  ( int  i  =   0 ; i  <   5 ; i ++ )
           {
               var dropItem  =   new  SelectListItem();
               dropItem.Value  =  i.ToString();
               dropItem.Text  =  i.ToString();
               dropList.Add(dropItem);
           }
         %>
         <% = Html.DropDownList( " myList " , dropList,  new  { style  =   " width:100px; "  }) %>
         < br  />
        6.使用HtmlHelper生成隐藏域:
         <% = Html.Hidden( " hidden " )  %>
         < br  />
        7.使用HtmlHelper生成列表框：
         <% var list  =   new  List < SelectListItem > ();
           for  (var i  =   0 ; i  <   5 ; i ++ )
          {
              var item  =   new  SelectListItem();
              item.Value  =  i.ToString();
              item.Text  =  i.ToString();
              list.Add(item); 
          }  
              %>
         <% = Html.ListBox( " listBox " , list,  new  {style = " width:100px; "  }) %>         
         < br  />        
        8.使用HtmlHelper生成密码输入框:
         <% = Html.Password( " password " , " longgel " )  %>
         < br  />
        9.使用HtmlHelper生成单选框:
         <% = Html.RadioButton( " radio " , " boy " , true )  %> 男
         <% = Html.RadioButton( " radio " , " girl " , false )  %> 女
         < br  />
        10.使用HtmlHelper生成部分视图（用户控件）：
         <%  Html.RenderPartial( " PartialView " );  %>
         < br  />
        11.使用HtmlHelper根据路由规则生成超链接：
         <% =  Html.RouteLink( " 我是由路由生成的超链接 " , new  {controller = " Simple " ,action = " Index " })  %>
         < br  />
        12.使用HtmlHelper生成富文本框：
         <% = Html.TextArea( " myTxtArea " , new {style = " width:300px; height:100px; " })  %>
         < br  />
        13.使用HtmlHelper生成文本框：
         <% = Html.TextBox( " myTxtBox " , " 我是文本框 " ) %>
     </ div >

其实大家可能注意到了，当我们在使用<%%>中有同样都是使用的HtmlHelper中的方法，为什么有的需要加上等号，有的不需要，其实在HtmlHelper中的方法中，只要是返回的是MvcHtmlString类型的方法都需要使用等号将值输出。在来看看生成的结果吧。

     < div >
        1.使用HtmlHelper生成超链接:
         < a  href ="/" > 我是超链接 </ a >
         < br  />
        2.使用HtmlHelper生成表单:
         < form  action ="/"  id ="myForm"  method ="post" ></ form >
         < br  />
        3.使用HtmlHelper根据路由规则生成表单:
         < form  action ="/Simple/Demo"  method ="post" ></ form >
         < br  />
        4.使用HtmlHelper生成一个复选框：
         < input  id ="myCheckBox"  name ="checkBox"  type ="checkbox"  value ="true"   />< input  name ="checkBox"  type ="hidden"  value ="false"   /> 复选框
         < br  />
        5.使用HtmlHelper生成上拉列表框:
         < select  id ="myList"  name ="myList"  style ="width:100px;" >< option  value ="0" > 0 </ option >
< option  value ="1" > 1 </ option >
< option  value ="2" > 2 </ option >
< option  value ="3" > 3 </ option >
< option  value ="4" > 4 </ option >
</ select >
         < br  />
        6.使用HtmlHelper生成隐藏域:
         < input  id ="hidden"  name ="hidden"  type ="hidden"  value =""   />
         < br  />
        7.使用HtmlHelper生成列表框：
         < select  id ="listBox"  multiple ="multiple"  name ="listBox"  style ="width:100px;" >< option  value ="0" > 0 </ option >
< option  value ="1" > 1 </ option >
< option  value ="2" > 2 </ option >
< option  value ="3" > 3 </ option >
< option  value ="4" > 4 </ option >
</ select >         
         < br  />        
        8.使用HtmlHelper生成密码输入框:
         < input  id ="password"  name ="password"  type ="password"  value ="longgel"   />
         < br  />
        9.使用HtmlHelper生成单选框:
         < input  checked ="checked"  id ="radio"  name ="radio"  type ="radio"  value ="boy"   /> 男
         < input  id ="radio"  name ="radio"  type ="radio"  value ="girl"   /> 女
         < br  />
        10.使用HtmlHelper生成部分视图（用户控件）：
        
 
< span  style ="background-color:Red" > Hi，我是部分视图（用户控件） </ span >
         < br  />
        11.使用HtmlHelper根据路由规则生成超链接：
         < a  href ="/" > 我是由路由生成的超链接 </ a >
         < br  />
        12.使用HtmlHelper生成富文本框：
         < textarea  cols ="20"  id ="myTxtArea"  name ="myTxtArea"  rows ="2"  style ="width:300px; height:100px;" >
</ textarea >
         < br  />
        13.使用HtmlHelper生成文本框：
         < input  id ="myTxtBox"  name ="myTxtBox"  type ="text"  value ="我是文本框"   />
     </ div >

另外HtmlHelper中还有ValidationMessage()和 ValidationSummary()等方法，下次学到验证的时候一起写出来。^_^

 

转载于:https://www.cnblogs.com/longgel/archive/2010/02/03/1662894.html