码迷,mamicode.com
首页 > Web开发 > 详细

asp.net mvc(七)

时间:2017-11-03 11:25:45      阅读:232      评论:0      收藏:0      [点我收藏+]

标签:src   key   文本   class   one   img   learn   gen   read   

       asp.net mvc和asp.net webfrom有个非常显著的特点就是前者去掉了所有的服务器控件,原来拉控件的好日子没有了,取代的是客户端控件。我们可以有两种方式创建这些客户端控件:

       第一:在View中手写html控件。优点是非常直观,缺点是增加代码量。

       第二:在View中利用System.Web.Mvc.Html下的HtmlHelper的完成大部分控件的客户端输出。

       HtmlHelper的功能:先看下它的源码大致结构。

技术分享
namespace System.Web.Mvc.Html
{
    public static class FormExtensions//表单相关扩展方法,例如创建表单标签等。

    public static class InputExtensions//这里包含了所有input,例如:text,button,readiobutton等等。

    public static class LinkExtensions//链接相关方法

    public class MvcForm : IDisposable//与客户端控件无关

    public static class RenderPartialExtensions//这是输出PartialView

    public static class SelectExtensions//输出下拉框

    public static class TextAreaExtensions//输出多行文本框

    public static class ValidationExtensions//输出相关表单元素验证。
}

技术分享

   
       示例:创建留言的View,有意思的是这里在创建表单时,应用了using,和C#是的写法一样,但它的目的是不显示调用Html.EndForm()方法,会在作用域最后自动添加了结束标签。

技术分享
<% using (Html.BeginForm())
       {%>
    <fieldset>
        <p>
            <label for="Title">
                标题:</label>
            <%= Html.TextBox("sTitle", Model.sTitle)%>
            
        </p>
        <p>
            <label for="EventDate">
                内容:</label>
            <%=Html.TextBox("sContent", Model.sContent)%>
           
        </p>
        
        <p>
            <input type="submit" onclick ="return check();" value="Save" />
        </p>
    </fieldset>
    <% }
    %>
技术分享

   
        System.Web.Mvc.Html下的HtmlHelper只能完成大部分html控件的输出,但像img标签默认是没有提供的,这里需要我们自行来扩展下Helper,毕竟上面的众多方法都是扩展出来的。

        扩展Helper,我们可以利用TagBuilder,它能输出所有标签及属性。TagBuilder提供下如下重要方法:

技术分享
// Methods
    public TagBuilder(string tagName);
    public void AddCssClass(string value);//增加样式
    public void GenerateId(string name);//设置控件ID
    private string GetAttributesString();
    public void MergeAttribute(string key, string value);//设置属性值
    public void MergeAttribute(string key, string value, bool replaceExisting);
    public void MergeAttributes<TKey, TValue>(IDictionary<TKey, TValue> attributes);
    public void MergeAttributes<TKey, TValue>(IDictionary<TKey, TValue> attributes, bool replaceExisting);
    public void SetInnerText(string innerText);//设置显示文本
    public override string ToString();
    public string ToString(TagRenderMode renderMode);//输出控件html
技术分享

    
       1:创建ImageHelper,利用TagBuilder部分方法最终输出img标签。

技术分享
public static class ImageHelper
    {
        public static string Image(this HtmlHelper helper, string id, string url, string alternateText)
        {
            return Image(helper, id, url, alternateText, null);
        }

        public static string Image(this HtmlHelper helper, string id, string url, string alternateText, object 

htmlAttributes)
        {
            // 创建IMG标签
            var builder = new TagBuilder("img");

            // 增加ID属性
            builder.GenerateId(id);

            // 增加属性
            builder.MergeAttribute("src", url);
            builder.MergeAttribute("alt", alternateText);
            builder.MergeAttributes(new RouteValueDictionary(htmlAttributes));

            // 输出完整的img标签
            return builder.ToString(TagRenderMode.SelfClosing);
        }

    }

技术分享

    
       2:页面调用。

<%= Html.Image("img1", "http://a.lakequincy.com/img/633820582974214892.jpg", "这是一张图片", new 

{border="4px"})%>

 
       总结:有了System.Web.Mvc.Html和TagBuilder,页面控件输出已全部解决。
   
       注:本文引用:http://www.asp.net/learn/mvc/tutorial-35-cs.aspx

asp.net mvc(七)

标签:src   key   文本   class   one   img   learn   gen   read   

原文地址:http://www.cnblogs.com/zhanglixina/p/7776721.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!