MVC扩展之HtmlHelper辅助方法

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;    }   }  } }

转载于:https://www.cnblogs.com/sky-net/p/5392402.html