前面第一天 我们看到的全是 js的代码,虽然不管是BS的框架是java 还是 php,复用性 还是特别高的, 但是 写起来比较费劲,怎么办,我们能不能 更 简单点呢?
当然可以,这个时候我们就要用到 .net的自定义控件 了。
首先我们 将第一天的代码 回顾一下,(下面我们有了一个初始的改变)
//这里运用的面向对象的思想 ,新建了一个按钮对象 var button = function () { this.control = null; //属性: 按钮对象的 自己 this.id = null; //按钮对象的 id this.value = null; //按钮对象显示的值 this.click = null; //按钮对象的点击事件 //接下来是初始化, 所有 按钮的属性 this.init = function (ClientId) { this.id = ClientId; //这个是页面传过来的id var button_html = '<div href="#" id="button_'+this.id+'" class="button" > ' + this.value + '</div>'; // 这个是我们要插入 的 html文件 this.control.after(button_html); this.control = $("#" + ClientId); //这是通过 id绑定控件 (有关 需找 标签 都要写到 页面加载完 标签之后执行) //绑定点击事件 14 $("#button_"+this.id+).unbind("click").bind("click",this.click); 15 this.control.hide(); //隐藏 当前控件
};
}
首先我们建立一个 类库 Control , 然后在建立一个 建立一个 ControlBase ( 这个类 是所有控件类的 父类)
public class ControlBase : WebControl // 继承webControl { /// <summary> /// 加载 /// </summary> /// <param name="e"></param> protected override void OnLoad(EventArgs e) // 重写 页面加载 { base.OnLoad(e); } /// <summary> /// 为指定页面添加一个自定义控件,需要放在 if(!IsPostBack){ } 之外才行。 /// </summary> /// <param name="page">页面</param> public static void AddWebcontrolBaseToPage(Page page) { for (int i = 0; i < page.Controls.Count; i++) { if (page.Controls[i] is ControlBase) { return; } } ControlBase controlbase = new ControlBase(); page.Controls.Add(controlbase); } /// <summary> /// 注册资源文件 /// </summary> /// <param name="strLink">资源字符串</param> /// <param name="control">控件</param> public static void RegisterSource(string strLink, System.Web.UI.Control control) { //为了保证资源只注册一次,循环比较,已存在了就不添加 bool flag = false; for (Int32 i = 0; i < control.Page.Header.Controls.Count; i++) { LiteralControl lc = control.Page.Header.Controls[i] as LiteralControl; if (lc != null) { if (lc.Text == strLink) { flag = true; break; } } } if (!flag) { LiteralControl include = new LiteralControl(strLink); control.Page.Header.Controls.Add(include); } } /// <summary> /// 控件添加属性 /// </summary> /// <param name="writer"></param> /// <param name="Name"></param> /// <param name="Value"></param> protected void AddAttributeToControl(HtmlTextWriter writer, string Name, string Value) { if (!string.IsNullOrEmpty(Value)) { writer.AddAttribute(Name, Value); } } }
然后 我们 在建立一个类 ,叫做 Button 的类,写法如下:
public class Button : ControlBase { #region 属性 /// <summary> /// 属性测试 /// </summary> [DefaultValue(""), Description("获取或设置页面ID")] public string FormID { get; set; } /// <summary> /// 设置页面样式表 /// </summary> public string Class // 这些属性都会在 页面呈现出来 { get; set; } #endregion #region 重载方法 /// <summary> /// 设置装载容器 /// </summary> protected override HtmlTextWriterTag TagKey { get { return HtmlTextWriterTag.Div; } } /// <summary> /// 控件加载其他操作方法 /// </summary> /// <param name="e"></param> protected override void OnLoad(EventArgs e) { base.OnLoad(e); } /// <summary> /// 输出控件前操作 /// </summary> /// <param name="e"></param> protected override void OnPreRender(EventArgs e) { base.OnPreRender(e); } /// <summary> /// 输出控件 /// </summary> /// <param name="writer"></param> protected override void Render(HtmlTextWriter writer) { base.Render(writer); if (this.Visible) { writer.WriteLine("<script type='text/javascript'>"); writer.WriteLine("//<![CDATA["); string query = this.ClientID + "_ButtonGroup"; writer.WriteLine("var " + query + "= new Button();"); writer.WriteLine(query + ".Init('" + this.ClientID + "','加载数据')"); writer.WriteLine("//]]>"); writer.WriteLine("</script>"); } } /// <summary> /// 控件中添加控件 /// </summary> /// <param name="writer"></param> protected override void RenderContents(HtmlTextWriter writer) { base.RenderContents(writer); } /// <summary> /// 给控件添加属性 /// </summary> /// <param name="writer"></param> protected override void AddAttributesToRender(HtmlTextWriter writer) { base.AddAttributesToRender(writer); writer.AddAttribute("class", "btn_container " + this.Class); if (!string.IsNullOrEmpty(this.FormID)) { writer.AddAttribute("FormID", this.FormID); } } #endregion #region 自定义方法 /// <summary> /// 获取组织数据 /// </summary> /// <returns></returns> private void OtherMethod() { } #endregion }
接下来 我们怎么将她们 用到前台呢?
首先 我们要添加该项目的引用:
然后在配置文件中配置:
如下图所看到的一样:
namespace 表示 添加引用的 项目的 命名空间的地址 如下图:Control 表示类库的名称
assembly 表示你需要添加的 引用的地址
tagPrefix 表示你添加 标签 名称:
<pages controlRenderingCompatibilityVersion="3.5" clientIDMode="AutoID" validateRequest="false"> <controls> <add namespace="Control" assembly="Control" tagPrefix="BaseControls"/> </controls> </pages>
然后我们新建一个 web页面,重新生成一下,打开 工具箱就 可以看到你要的控件了。
或者 直接 输入 <BaseControls: 就能看到你要写的自定义控件了
<BaseControls:Button Class="2323" ID="2323" runat="server"/>