Web用户自定义控件

Posted 2020-09-17 叶祖辉

在新建项的时候,选择Web用户控件,可用来自定义自己的控件,做好后,直接拖到页面即可使用
自定义控件与WEB交互,需要在 自定义控件里面 写 属性，如：

    public string CityID
    {
        get { return this.DropDownList1.SelectedValue; }
        
        set{ this.DropDownList1.SelectedValue = value;} 
    }

在外面调用的时候如下即可：

Label1.Text = this.City1.CityID;

自定义样式（公开属性）

    public ConsoleColor Color { get; set; }
    public string Title { get; set; }

定义 样式属性

<h1><%=this.Title  %></h1>
<div style=‘%=this.Color%>‘>
    组装的一些控件
</div>

样式调用

 this.City1.Title = "标题";
 this.City1.Color = ConsoleColor.Blue;

 

Web用户控件 公开事件

由于控件是 封装过的,所以当用户控件激发事件时,最外层是得不到数据的,解决办法有3种：

注：用户控件需设置 AutoPostBack="True"

-------- 1.利用系统的 EventHandler 委托

<1>.在用户控件后台文件内新建一个属性

    public string CityID 
    {
        get { return DropDownList1.SelectedValue; }
        set { DropDownList1.SelectedValue = value; }
    }

<2>.新建一个 event 事件

public event EventHandler CitySelected = null;

<3>.当用户控件中的SelectedIndexChanged事件触发时,激活 CitySelected 事件

    protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
    {
        if (this.CitySelected != null)
        {
            this.CitySelected(this, null);
        }
    }

<4>.在页面的后台 新建一个方法,用来处理用户控件返回的信息

    public void showCity(object sender, EventArgs e)
    {
        this.Label1.Text = this.City1.CityID;
    }

<5>.在页面的用户控件中 注册事件

<uc1:City ID="City1" runat="server" OnCitySelected="showCity" />

 

利用自定义的 委托

 <1>.自定义一个委托

public delegate void CitySelectedEventHander(string CityID);

<2>.自定义一个事件

    public event CitySelectedEventHander CitySeleted = null;

<3>.当用户控件触发时,激活自定义事件

    protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
    {
        if (CitySeleted != null)
        {
            string CityID = this.DropDownList1.SelectedValue;
            this.CitySeleted(CityID);
        }
    }

<4>.在页面后台新建一个方法,用于处理用户控件的事件

    public void ShowCity(string id)
    {
        this.Label1.Text = id;
    }

<5>.在页面的用户控件中 注册事件

    <uc1:City2 ID="City21" runat="server" onCitySeleted="ShowCity" />

 

利用系统委托 泛型事件（推荐使用）

 <1>.定义一个类,继承EventArgs类,主要用于封装属性,以便日后扩展

    public class CityEventArgs:EventArgs
    {
       public string CityID { get; set; }
    }

<2>.定义一个 泛型事件,用自定义的类做 参数

    public event EventHandler<CityEventArgs> CitySeleted = null;

<3>.在页面后台新建一个方法,用于处理用户控件的事件

    public void ShowCity(object sender,CityEventArgs e)
    {
        this.Label2.Text = e.CityID;
    }

<4>.在页面的用户控件中 注册事件

    <uc1:City3 ID="City31" runat="server" OnCitySeleted="ShowCity" />

注：注册事件也可用如下方法：

    protected void Page_Load(object sender, EventArgs e)
    {
       this.City31.CitySeleted += new EventHandler<CityEventArgs>(City31_CitySeleted);
    }

    void City31_CitySeleted(object sender, CityEventArgs e)
    {
        this.Label2.Text = e.CityID;
    }

 

动态增加用户控件

 在上面的基础上,增加如下内容:

Control c = this.LoadControl("City3.ascx");
City3 uc = c as City3;
uc.CityID = "SH";
this.PlaceHolder1.Controls.Add(uc);

注：PlaceHolder1是容器,当前页面需要在头部注册信息

<%@ Register src="~/UC/City3.ascx" tagname="City3" tagprefix="uc1" %>