zoukankan      html  css  js  c++  java
  • 转:ASP.NET MVC HtmlHelper用法大全

    摘自:http://blog.sina.com.cn/s/blog_5f8d04170100lt6g.html

    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 = "300px;" }) %>
    <%=Html.TextBox("input3", ViewData["Name"],new{ @style = "300px;" }) %>
    <%=Html.TextBoxFor(a => a.CategoryName, new { @style = "300px;" })%>
     
    生成结果:
     
    <input id="input1" name="input1" type="text" value="" />
    <input id="input2" name="input2" style="300px;" type="text" value="Beverages" />
    <input id="input3" name="input3" style="300px;" type="text" value="" />
    <input id="CategoryName" name="CategoryName" style="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"); %>  看清楚了没有等号的。

  • 相关阅读:
    Android自定义之仿360Root大师水纹效果
    Android之TextView的Span样式源码剖析
    Android之TextView的样式类Span的使用详解
    随着ScrollView的滑动,渐渐的执行动画View
    仿微信主界面导航栏图标字体颜色的变化
    android自定义之 5.0 风格progressBar
    Android性能优化之内存篇
    Android性能优化之运算篇
    How to install Zabbix5.0 LTS version with Yum on the CentOS 7.8 system?
    How to install Zabbix4.0 LTS version with Yum on the Oracle Linux 7.3 system?
  • 原文地址:https://www.cnblogs.com/ttsoft/p/1827886.html
Copyright © 2011-2022 走看看