您的位置:首页 > 编程语言 > ASP

转:ASP.NET MVC扩展之HtmlHelper辅助方法

2015-12-16 10:16 816 查看
1、什么是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//输出相关表单元素验证。
}


比如对于扩展类InputExtensions,MVC框架本身对此已有扩展:

namespace System.Web.Mvc.Html
{
// Summary:
//     Represents support for HTML input controls in an application.
public static class InputExtensions
{
public static MvcHtmlString CheckBox(this HtmlHelper htmlHelper, string name);
}
}


2、通过对HtmlHelper进行扩展来构建自己的HtmlHelper辅助方法

System.Web.Mvc.Html下的HtmlHelper只能完成大部分html控件的输出,有一些我们经常用到的东东它却没有,怎么办?自己动手吧~

在我们扩展之前,有个叫TagBuilder的类(生成标签)比较好用,你不必纠结于它的细节,只要大概知道他有那些方法就行:

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


现在可以开始扩展了!

A、扩展img标签

namespace System.Web.Mvc
{
public static class ImageExtensions
{
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);
}

}
}


调用:@Html.Image("img1", http://img/111.jpg, "这是一张图片", new {border="4px"})

输出:<img id="img1" src="http://img/111.jpg" style="border:4px;" alt="这是一张图片"/>

B、扩展div标签

namespace System.Web.Mvc
{
public static class DivExtensions
{
public static String Div(this HtmlHelper helper, String id, String content, String cssStyle, object htmlAttrs)
{
TagBuilder builder = new TagBuilder("div");
//替换“.”为“_”
builder.IdAttributeDotReplacement = "_";
builder.GenerateId(id);
builder.MergeAttributes(new RouteValueDictionary(htmlAttrs));
builder.AddCssClass(cssStyle);
builder.InnerHtml=content;
return builder.ToString(TagRenderMode.Normal);    //代表是双面标签
}
}
}


调用:

@Html.Div("MyDiv.1", "扩展方法", "MyClassStyle", new { style="border:solid red 1px;" })

输出:

<div id="MyDiv_1" class="MyClassStyle" style="border:solid red 1px;">扩展方法</div>

C、扩展Span标签

namespace System.Web.Mvc
{
public static class SpanExtensions
{
public static string Span(this HtmlHelper helper, string id, string text, string css, object htmlAttributes)
{
//创意某一个Tag的TagBuilder
var builder = new TagBuilder("span");

//创建Id,注意要先设置IdAttributeDotReplacement属性后再执行GenerateId方法.
builder.IdAttributeDotReplacement = "-";
builder.GenerateId(id);

//添加属性
builder.MergeAttributes(new RouteValueDictionary(htmlAttributes));

//添加样式
builder.AddCssClass(css);
//或者用下面这句的形式也可以: builder.MergeAttribute("class", css);

//添加内容,以下两种方式均可
//builder.InnerHtml = text;
builder.SetInnerText(text);

//输出控件
return builder.ToString(TagRenderMode.Normal);

}
}
}


调用:

@Html.Span("span.test", "使用TagBuilder帮助构建扩展方法", "ColorRed", new { style="font-size:15px;" })

输出:

<span id="span-test" class="ColorRed" style="font-size: 15px;">使用TagBuilder帮助构建扩展方法</span>

D、扩展ul、li标签

namespace System.Web.Mvc
{
public static class UlLiExtensions
{
public static MvcHtmlString UlLi(this HtmlHelper helper, string[] listItems)

{

TagBuilder ulTag = new TagBuilder("ul");

foreach (string item in listItems)

{

TagBuilder liTag = new TagBuilder("li");

liTag.SetInnerText(item);

ulTag.InnerHtml += liTag.ToString();

}

return new MvcHtmlString(ulTag.ToString());

}

}
}


调用:

@Html.List(new string[]{"上海","深圳","北京","广州"})

输出:

<ul>
<li>上海</li>
<li>深圳</li>
<li>北京</li>
<li>广州</li>
</ul>


E、扩展截取字符串方法(当我们在显示某一个字段时,如果太长,显示的时候最好截取一下,最好是做成扩展方法来用)

namespace System.Web.Mvc
{
public static class CutStringExtensions
{
public static string CutString(this  System.Web.Mvc.HtmlHelper helper, string content, int length)
{
if (content.Length > length)
{
return content.Substring(0, length) + "...";
}
else
{
return content;
}
}

}
}


此处只是抛砖引玉,更多的用法要根据实际需求来进行开发~
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: