JQuery EasyUI类库，大家不会陌生，出来已经有很多年了。个人感觉还是很好用的，作者更新频率也很快，bug也及时修复。

　　最近在整理以前的代码，找到了这个组件，它是将EasyUI组件封装成MVC控件，这样我们就可以不用写那些html标签了，我们先看看调用方式

     
          @Html.HiddenFor(c => c.ID)    @Html.HiddenFor(c => c.EditMode)    @Html.HiddenFor(c => c.CodeTypeID)    @Html.HiddenFor(c => c.CreateUserID)    
      
               
        
                     
@Html.EasyUI().LabelFor(c => c.CodeID).Required(true)
                     
@Html.EasyUI().ValidateBoxFor(c => c.CodeID).Required(true).Width("60%")
                
                
                     
@Html.EasyUI().LabelFor(c => c.CodeName).Required(true)
                     
@Html.EasyUI().ValidateBoxFor(c => c.CodeName).Required(true).Width("60%")
                
                
                     
@Html.EasyUI().LabelFor(c => c.CodeTypeName)
                     
@Html.DisplayFor(c => c.CodeTypeName)
                
                
                     
@Html.EasyUI().LabelFor(c => c.IsUsed)
                     
@Html.DropDownListMetaCodeFor(c => c.IsUsed, MetaSourceType.Null, string.Empty, new{ @style = "width:60%;" })
                
                
                     
@Html.EasyUI().LabelFor(c => c.SortOrder)
                     
@Html.EasyUI().NumberBoxFor(c => c.SortOrder).Min(10).Value(10).Width("60%")
                
                
                     
@Html.EasyUI().LabelFor(c => c.CreateUserName)
                     
@Html.EasyUI().ValidateBoxFor(c => c.CreateUserName).Width("60%")
                
                
                     
@Html.EasyUI().LabelFor(c => c.CreateTime)
                     
@Html.EasyUI().DateBoxFor(c => c.CreateTime)
                
           
      
     

　　

　　我们再来看看代码是如何实现的，下面是整个项目布局

　　其实代码不复杂，最关键的是TagElementBuilder.cs这个类

using System;using System.Linq;using System.Web;using System.Web.Mvc;namespace NS.Utility.EasyUI{    public abstract class TagElementBuilder
     
       : IHtmlString where T : class    {        #region 私有变量        private TagBuilder tagBuilder;        #endregion        #region 公有属性        /// 
      
        /// 组件Tag标签类型.包括input,select,label等        /// 
        public abstract string TagName { get; }        /// 
      
        /// Tag标签组装类        /// 
        protected TagBuilder TagBuilder        {            get            {                if (this.tagBuilder != null)                    return this.tagBuilder;                return this.tagBuilder = new TagBuilder(TagName);            }        }                  #endregion        #region 私有方法        /// 
      
        /// 判断class名称是否存在        /// 
        /// 
              /// 
              private bool ContainsClass(string className)        {            string classs;            if (!TagBuilder.Attributes.TryGetValue("class", out classs))            {                return false;            }            var classArray = classs.Split(new[] { ' ' }, StringSplitOptions.RemoveEmptyEntries).ToArray();            return classArray.Any(i => string.Equals(i, className, StringComparison.OrdinalIgnoreCase));        }        #endregion        #region 公有方法        /// 
      
        /// 设置ID属性值        /// 
        /// 
              /// 
              public T ID(string id)        {            this.TagBuilder.GenerateId(id);            return this as T;        }        /// 
      
        /// 设置Name属性值        /// 
        /// 
              /// 
              public T Name(string name)        {            this.TagBuilder.MergeAttribute("name", name, true);            return this as T;        }        /// 
      
        /// 设置Attribute属性列表        /// 
        /// 
              /// 
              /// 
              /// 
              public T Attribute(string key, string value, bool replaceExisting = false)        {            this.TagBuilder.MergeAttribute(key, value, replaceExisting);            return this as T;        }        /// 
      
        /// 增加class属性值        /// 
        /// 
              /// 
              public T AddClass(string className)        {            if (string.IsNullOrWhiteSpace(className))            {                return this as T;            }            if (ContainsClass(className))            {                return this as T;            }            TagBuilder.AddCssClass(className);            return this as T;        }        /// 
      
        /// 删除class属性值        /// 
        /// 
              /// 
              public T RemoveClass(string className)        {            if (string.IsNullOrWhiteSpace(className))            {                return this as T;            }            if (!ContainsClass(className))            {                return this as T;            }            var classs = TagBuilder.Attributes["class"];            var classArray = classs.Split(new[] { ' ' }, StringSplitOptions.RemoveEmptyEntries)                .Where(i => string.Equals(i, className, StringComparison.OrdinalIgnoreCase));            TagBuilder.Attributes["class"] = string.Join(" ", classArray);            return this as T;        }        /// 
      
        /// 合并class属性值        /// 
        /// 
              /// 
              public T ToggleClass(string className)        {            if (string.IsNullOrWhiteSpace(className))            {                return this as T;            }            return ContainsClass(className) ? RemoveClass(className) : AddClass(className);        }        #endregion        #region 抽象方法        /// 
      
        /// 返回HTML编码的字符串(子类必须重写)        /// 
        /// 
              public abstract string ToHtmlString();        #endregion    }}
     

　　

　　再看看具体是如何实现的？

using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Web.Mvc;using System.Web.Mvc.Html;namespace NS.Utility.EasyUI{    public class ComboBoxBuilder : TagElementBuilder
     
          {        #region 私有变量        private bool required = false;        private string valueField = string.Empty;        private string textField = string.Empty;        private string groupField = string.Empty;        private string groupFormatter = string.Empty;        private EasyUIComboBoxMode mode = EasyUIComboBoxMode.local;        private string url = string.Empty;        private EasyUIComboBoxMethod method = EasyUIComboBoxMethod.post;        private string data = string.Empty;        private string filter = string.Empty;        private string formatter = string.Empty;        private string loader = string.Empty;        private string loadFilter = string.Empty;        private string onBeforeLoad = string.Empty;        private string onLoadSuccess = string.Empty;        private string onLoadError = string.Empty;        private string onSelect = string.Empty;        private string onUnselect = string.Empty;        #endregion        #region 公有方法        public ComboBoxBuilder Required(bool required)        {            this.required = required;            return this;        }        public ComboBoxBuilder ValueField(string valueField)        {            this.valueField = valueField;            return this;        }        public ComboBoxBuilder TextField(string textField)        {            this.textField = textField;            return this;        }        public ComboBoxBuilder GroupField(string groupField)        {            this.groupField = groupField;            return this;        }        public ComboBoxBuilder GroupFormatter(string groupFormatter)        {            this.groupFormatter = groupFormatter;            return this;        }        public ComboBoxBuilder Mode(EasyUIComboBoxMode mode)        {            this.mode = mode;            return this;        }        public ComboBoxBuilder Url(string url)        {            this.url = url;            return this;        }        public ComboBoxBuilder Method(EasyUIComboBoxMethod method)        {            this.method = method;            return this;        }        public ComboBoxBuilder Data(string data)        {            this.data = data;            return this;        }        public ComboBoxBuilder Filter(string filter)        {            this.filter = filter;            return this;        }        public ComboBoxBuilder Formatter(string formatter)        {            this.formatter = formatter;            return this;        }        public ComboBoxBuilder Loader(string loader)        {            this.loader = loader;            return this;        }        public ComboBoxBuilder LoadFilter(string loadFilter)        {            this.loadFilter = loadFilter;            return this;        }        public ComboBoxBuilder OnBeforeLoad(string onBeforeLoad)        {            this.onBeforeLoad = onBeforeLoad;            return this;        }        public ComboBoxBuilder OnLoadSuccess(string onLoadSuccess)        {            this.onLoadSuccess = onLoadSuccess;            return this;        }        public ComboBoxBuilder OnLoadError(string onLoadError)        {            this.onLoadError = onLoadError;            return this;        }        public ComboBoxBuilder OnSelect(string onSelect)        {            this.onSelect = onSelect;            return this;        }        public ComboBoxBuilder OnUnselect(string onUnselect)        {            this.onUnselect = onUnselect;            return this;        }        #endregion        #region TagElementBuilder 重写属性和方法        public override string TagName        {            get { return "input"; }        }        public override string ToHtmlString()        {            //参考格式:
                   //拼接class属性值            TagBuilder.AddCssClass("easyui-combobox");            //拼接data-options属性值            List
      
        listAttri = new List
       
        ();            //开始拼接各种属性值            if (this.required == true)            {                //是否必输项                listAttri.Add(string.Format("required:{0}", this.required.ToString().ToLower()));            }            if (string.IsNullOrEmpty(this.valueField) == false)            {                listAttri.Add(string.Format("valueField:'{0}'", this.valueField));            }            if (string.IsNullOrEmpty(this.textField) == false)            {                listAttri.Add(string.Format("textField:'{0}'", this.textField));            }            if (string.IsNullOrEmpty(this.groupField) == false)            {            }            if (this.mode != EasyUIComboBoxMode.local)            {            }            if (string.IsNullOrEmpty(this.url) == false)            {                listAttri.Add(string.Format("url:'{0}'", this.url));            }            if (this.method == EasyUIComboBoxMethod.get)            {            }            if (string.IsNullOrEmpty(this.data) == false)            {            }            if (string.IsNullOrEmpty(this.filter) == false)            {            }            if (string.IsNullOrEmpty(this.formatter) == false)            {            }            if (string.IsNullOrEmpty(this.loader) == false)            {                     }            if (string.IsNullOrEmpty(this.loadFilter) == false)            {            }            //开始拼接各种事件            if (string.IsNullOrEmpty(this.onBeforeLoad) == false)            {            }            if (string.IsNullOrEmpty(this.onLoadSuccess) == false)            {            }            if (string.IsNullOrEmpty(this.onLoadError) == false)            {            }            if (string.IsNullOrEmpty(this.onSelect) == false)            {            }            if (string.IsNullOrEmpty(this.onUnselect) == false)            {            }            string dataOptions = string.Join(",", listAttri.ToArray());            TagBuilder.Attributes.Add("data-options", dataOptions);            var builder = new StringBuilder();            var tagHtml = TagBuilder.ToString(TagRenderMode.SelfClosing);            builder.AppendLine(tagHtml);            return new MvcHtmlString(builder.ToString()).ToHtmlString();        }        #endregion    }}
       
      
     

　　看，其实并不复杂吧，完整源码是必须提供的

 

源码下载方式

1，关注微信公众号：小特工作室（也可直接扫描签名处二维码）

2，发送：示例4011

即可下载