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

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

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

(asp.net MVC学习)System.Web.Mvc.HtmlHelper学习及使用
(asp.net MVC学习)System.Web.Mvc.HtmlHelper学习及使用
    <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>
(asp.net MVC学习)System.Web.Mvc.HtmlHelper学习及使用
(asp.net MVC学习)System.Web.Mvc.HtmlHelper学习及使用

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

(asp.net MVC学习)System.Web.Mvc.HtmlHelper学习及使用
(asp.net MVC学习)System.Web.Mvc.HtmlHelper学习及使用
    <div>
         1.使用HtmlHelper生成超链接:
        
<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根据路由规则生成超链接:
        
<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>
(asp.net MVC学习)System.Web.Mvc.HtmlHelper学习及使用
(asp.net MVC学习)System.Web.Mvc.HtmlHelper学习及使用

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

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

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

(asp.net MVC学习)System.Web.Mvc.HtmlHelper学习及使用
(asp.net MVC学习)System.Web.Mvc.HtmlHelper学习及使用
    <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>
(asp.net MVC学习)System.Web.Mvc.HtmlHelper学习及使用
(asp.net MVC学习)System.Web.Mvc.HtmlHelper学习及使用

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

(asp.net MVC学习)System.Web.Mvc.HtmlHelper学习及使用
(asp.net MVC学习)System.Web.Mvc.HtmlHelper学习及使用
    <div>
         1.使用HtmlHelper生成超链接:
        
<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根据路由规则生成超链接:
        
<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>
(asp.net MVC学习)System.Web.Mvc.HtmlHelper学习及使用
(asp.net MVC学习)System.Web.Mvc.HtmlHelper学习及使用

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

(asp.net MVC学习)System.Web.Mvc.HtmlHelper学习及使用,布布扣,bubuko.com

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

原文:http://www.cnblogs.com/guojian/p/3756917.html

上一篇:virtualbox+vagrant学习-2(command cli)-20-vagrant suspend命令


下一篇:RDIFramework.NET V2.7 Web版本号升手风琴+树型文件夹(2级+)方法