Dynamic composite control

Discussion in 'ASP .Net Building Controls' started by James Gomount, Dec 26, 2003.

  1. I want to build a control that can dynamically display different sub
    controls.
    For example, there is a dropdownlist and a submit button. When an item is
    selected from the drop down list and the user press the button, I want to
    display other controls (i.e. Textbox and buttons) depending on the item
    selected in the dropdownlist.

    I think I should create a web custom control, but I am not sure where I
    should create and display the sub controls (maybe in CreateChildControls).

    Is there any samples or good references for things like that?




    ---
    Outgoing mail is certified Virus Free.
    Checked by AVG anti-virus system (http://www.grisoft.com).
    Version: 6.0.553 / Virus Database: 345 - Release Date: 2003-12-18
    James Gomount, Dec 26, 2003
    #1
    1. Advertising

  2. James Gomount

    Jos Guest

    James Gomount wrote:
    > I want to build a control that can dynamically display different sub
    > controls.
    > For example, there is a dropdownlist and a submit button. When an
    > item is selected from the drop down list and the user press the
    > button, I want to display other controls (i.e. Textbox and buttons)
    > depending on the item selected in the dropdownlist.
    >
    > I think I should create a web custom control, but I am not sure where
    > I should create and display the sub controls (maybe in
    > CreateChildControls).
    >
    > Is there any samples or good references for things like that?


    I guess you can create them at any time. In onSelectedIndexChanged
    would be OK, but this will cause trouble when you want those controls
    to post back. The reason is that, for controls to post back, they need
    to be re-created when the control is rebuilt. Otherwise the postback
    event will not fire.

    If the maximum number of dynamic controls is known, you may also
    create all of them in CreateChildControls, hide them (Visible=False),
    and just unhide the ones you want when they are needed.

    --

    Jos
    Jos, Dec 27, 2003
    #2
    1. Advertising

  3. I made a small sample with a Web user control. With the web user control
    everything works fine, but when I try to convert this to a Web custom
    control I have problems with the Postback.

    Any hints on how to make this a custom control?

    Code is below.

    WebUserControl1.ascx
    ------------------------
    namespace DynUpdateTest
    {
    using System;
    using System.Data;
    using System.Drawing;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using System.Web.UI.HtmlControls;

    /// <summary>
    /// Summary description for WebUserControl1.
    /// </summary>
    public class WebUserControl1 : System.Web.UI.UserControl
    {
    protected System.Web.UI.WebControls.DropDownList ddl;
    protected System.Web.UI.WebControls.Panel panelField;
    protected System.Web.UI.WebControls.Label lblResult;

    public int MaxItems
    {
    get { return _maxItems; }
    set { _maxItems = value; }
    }
    private int _maxItems;

    private void Page_Load(object sender, System.EventArgs e)
    {
    if (!IsPostBack)
    {
    ddl.Items.Add("-- Select an item --");
    for (int i=1; i<=_maxItems; i++)
    ddl.Items.Add(i.ToString());
    }

    if (ddl.SelectedIndex > 0)
    {
    for (int i=0; i<ddl.SelectedIndex; i++)
    {
    TextBox box = new TextBox();
    box.ID = "box_" + ddl.SelectedItem + "_" + i.ToString();
    panelField.Controls.Add(new LiteralControl("<b>" + box.ID + ": </b>"));
    panelField.Controls.Add(box);
    panelField.Controls.Add(new LiteralControl("<br>"));
    }

    Button cmdSubmit = new Button();
    cmdSubmit.ID = "cmdSubmit";
    cmdSubmit.Text = "Send";
    cmdSubmit.Click += new EventHandler(cmdSubmit_Click);
    panelField.Controls.Add(cmdSubmit);

    }
    }

    #region Web Form Designer generated code
    override protected void OnInit(EventArgs e)
    {
    //
    // CODEGEN: This call is required by the ASP.NET Web Form Designer.
    //
    InitializeComponent();
    base.OnInit(e);
    }

    /// <summary>
    /// Required method for Designer support - do not modify
    /// the contents of this method with the code editor.
    /// </summary>
    private void InitializeComponent()
    {
    this.ddl.SelectedIndexChanged += new
    System.EventHandler(this.ddl_SelectedIndexChanged);
    this.Load += new System.EventHandler(this.Page_Load);

    }
    #endregion

    private void cmdSubmit_Click(object sender, EventArgs e)
    {
    //Show the results
    lblResult.Text = "";

    foreach (Control ctr in panelField.Controls)
    {
    if (ctr is TextBox)
    {
    TextBox txt = (TextBox) ctr;
    lblResult.Text += String.Format("{0} -> {1}<br>", txt.ID, txt.Text);
    }
    }
    }

    private void ddl_SelectedIndexChanged(object sender, System.EventArgs e)
    {
    lblResult.Text = "";
    }
    }
    }


    -----------
    WebUserControl1.ascx
    ----------
    <%@ Control Language="c#" AutoEventWireup="false"
    Codebehind="WebUserControl1.ascx.cs"
    Inherits="DynUpdateTest.WebUserControl1"
    TargetSchema="http://schemas.microsoft.com/intellisense/ie5"%>
    <asp:DropDownList id="ddl" runat="server" AutoPostBack="True"
    Width="167px"></asp:DropDownList>
    <HR width="100%" SIZE="1">
    <asp:panel id="panelField" runat="server"></asp:panel>
    <HR width="100%" SIZE="1">
    <asp:Label id="lblResult" runat="server"></asp:Label>


    -----
    WebForm4.aspx.cs
    ------
    <%@ Page language="c#" Codebehind="WebForm4.aspx.cs" AutoEventWireup="false"
    Inherits="DynUpdateTest.WebForm4" %>
    <%@ Register TagPrefix="uc1" TagName="WebUserControl1"
    Src="WebUserControl1.ascx" %>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
    <HTML>
    <HEAD>
    <title>WebForm4</title>
    <meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
    <meta name="CODE_LANGUAGE" Content="C#">
    <meta name="vs_defaultClientScript" content="JavaScript">
    <meta name="vs_targetSchema"
    content="http://schemas.microsoft.com/intellisense/ie5">
    </HEAD>
    <body MS_POSITIONING="GridLayout">
    <form id="Form1" method="post" runat="server">
    <uc1:WebUserControl1 id="WebUserControl11" runat="server"
    MaxItems="5"></uc1:WebUserControl1>
    </form>
    </body>
    </HTML>
    James Gomount, Dec 28, 2003
    #3
  4. Hi James,

    From your description it looks like a custom control would fit better. When
    creating a composite custom control, CreateChildControls is the method where
    to put creation of child controls. If you're looking into custom control
    development I highly recommend reading this[1] book.

    [1] http://www.amazon.com/exec/obidos/ASIN/0735615829/laplatayacom
    --
    Victor Garcia Aprea
    Microsoft MVP | ASP.NET
    Looking for insights on ASP.NET? Read my blog:
    http://obies.com/vga/blog.aspx

    To contact me remove 'NOSPAM'. Please post all questions to the newsgroup
    "James Gomount" <> wrote in message
    news:...
    > I made a small sample with a Web user control. With the web user control
    > everything works fine, but when I try to convert this to a Web custom
    > control I have problems with the Postback.
    >
    > Any hints on how to make this a custom control?
    >
    > Code is below.
    >
    > WebUserControl1.ascx
    > ------------------------
    > namespace DynUpdateTest
    > {
    > using System;
    > using System.Data;
    > using System.Drawing;
    > using System.Web;
    > using System.Web.UI;
    > using System.Web.UI.WebControls;
    > using System.Web.UI.HtmlControls;
    >
    > /// <summary>
    > /// Summary description for WebUserControl1.
    > /// </summary>
    > public class WebUserControl1 : System.Web.UI.UserControl
    > {
    > protected System.Web.UI.WebControls.DropDownList ddl;
    > protected System.Web.UI.WebControls.Panel panelField;
    > protected System.Web.UI.WebControls.Label lblResult;
    >
    > public int MaxItems
    > {
    > get { return _maxItems; }
    > set { _maxItems = value; }
    > }
    > private int _maxItems;
    >
    > private void Page_Load(object sender, System.EventArgs e)
    > {
    > if (!IsPostBack)
    > {
    > ddl.Items.Add("-- Select an item --");
    > for (int i=1; i<=_maxItems; i++)
    > ddl.Items.Add(i.ToString());
    > }
    >
    > if (ddl.SelectedIndex > 0)
    > {
    > for (int i=0; i<ddl.SelectedIndex; i++)
    > {
    > TextBox box = new TextBox();
    > box.ID = "box_" + ddl.SelectedItem + "_" + i.ToString();
    > panelField.Controls.Add(new LiteralControl("<b>" + box.ID + ":

    </b>"));
    > panelField.Controls.Add(box);
    > panelField.Controls.Add(new LiteralControl("<br>"));
    > }
    >
    > Button cmdSubmit = new Button();
    > cmdSubmit.ID = "cmdSubmit";
    > cmdSubmit.Text = "Send";
    > cmdSubmit.Click += new EventHandler(cmdSubmit_Click);
    > panelField.Controls.Add(cmdSubmit);
    >
    > }
    > }
    >
    > #region Web Form Designer generated code
    > override protected void OnInit(EventArgs e)
    > {
    > //
    > // CODEGEN: This call is required by the ASP.NET Web Form Designer.
    > //
    > InitializeComponent();
    > base.OnInit(e);
    > }
    >
    > /// <summary>
    > /// Required method for Designer support - do not modify
    > /// the contents of this method with the code editor.
    > /// </summary>
    > private void InitializeComponent()
    > {
    > this.ddl.SelectedIndexChanged += new
    > System.EventHandler(this.ddl_SelectedIndexChanged);
    > this.Load += new System.EventHandler(this.Page_Load);
    >
    > }
    > #endregion
    >
    > private void cmdSubmit_Click(object sender, EventArgs e)
    > {
    > //Show the results
    > lblResult.Text = "";
    >
    > foreach (Control ctr in panelField.Controls)
    > {
    > if (ctr is TextBox)
    > {
    > TextBox txt = (TextBox) ctr;
    > lblResult.Text += String.Format("{0} -> {1}<br>", txt.ID, txt.Text);
    > }
    > }
    > }
    >
    > private void ddl_SelectedIndexChanged(object sender, System.EventArgs e)
    > {
    > lblResult.Text = "";
    > }
    > }
    > }
    >
    >
    > -----------
    > WebUserControl1.ascx
    > ----------
    > <%@ Control Language="c#" AutoEventWireup="false"
    > Codebehind="WebUserControl1.ascx.cs"
    > Inherits="DynUpdateTest.WebUserControl1"
    > TargetSchema="http://schemas.microsoft.com/intellisense/ie5"%>
    > <asp:DropDownList id="ddl" runat="server" AutoPostBack="True"
    > Width="167px"></asp:DropDownList>
    > <HR width="100%" SIZE="1">
    > <asp:panel id="panelField" runat="server"></asp:panel>
    > <HR width="100%" SIZE="1">
    > <asp:Label id="lblResult" runat="server"></asp:Label>
    >
    >
    > -----
    > WebForm4.aspx.cs
    > ------
    > <%@ Page language="c#" Codebehind="WebForm4.aspx.cs"

    AutoEventWireup="false"
    > Inherits="DynUpdateTest.WebForm4" %>
    > <%@ Register TagPrefix="uc1" TagName="WebUserControl1"
    > Src="WebUserControl1.ascx" %>
    > <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
    > <HTML>
    > <HEAD>
    > <title>WebForm4</title>
    > <meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
    > <meta name="CODE_LANGUAGE" Content="C#">
    > <meta name="vs_defaultClientScript" content="JavaScript">
    > <meta name="vs_targetSchema"
    > content="http://schemas.microsoft.com/intellisense/ie5">
    > </HEAD>
    > <body MS_POSITIONING="GridLayout">
    > <form id="Form1" method="post" runat="server">
    > <uc1:WebUserControl1 id="WebUserControl11" runat="server"
    > MaxItems="5"></uc1:WebUserControl1>
    > </form>
    > </body>
    > </HTML>
    >
    >
    Victor Garcia Aprea [MVP], Jan 5, 2004
    #4
  5. James Gomount

    ton Guest

    I was looking for the same matter (look at my messages, from end of
    januari). If you haven't solve it than here some hints

    It is very simple once you know how things are done:
    Implementing the InamingContainer
    Add all your controls in CreateChildControls
    like
    Dim button1 As New Button()
    button1.Text = "Submit"
    Controls.Add(button1)
    'Notice the event handler defined below
    AddHandler button1.Click, AddressOf Me.ButtonClicked

    in ButtonClicked you have to clear all controls and add your new controls
    dynamically

    special thanks to Alessandro Zifiglio and Arthur Mnev

    Ton



    "James Gomount" <> schreef in bericht
    news:OIMsn%23%...
    > I want to build a control that can dynamically display different sub
    > controls.
    > For example, there is a dropdownlist and a submit button. When an item is
    > selected from the drop down list and the user press the button, I want to
    > display other controls (i.e. Textbox and buttons) depending on the item
    > selected in the dropdownlist.
    >
    > I think I should create a web custom control, but I am not sure where I
    > should create and display the sub controls (maybe in CreateChildControls).
    >
    > Is there any samples or good references for things like that?
    >
    >
    >
    >
    > ---
    > Outgoing mail is certified Virus Free.
    > Checked by AVG anti-virus system (http://www.grisoft.com).
    > Version: 6.0.553 / Virus Database: 345 - Release Date: 2003-12-18
    >
    >
    ton, Feb 3, 2004
    #5
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Replies:
    0
    Views:
    718
  2. sleigh
    Replies:
    1
    Views:
    2,687
    sleigh
    Feb 12, 2004
  3. shapper
    Replies:
    6
    Views:
    954
    shapper
    Dec 26, 2007
  4. Chad
    Replies:
    0
    Views:
    222
  5. Mike

    Composite vs non composite Controls

    Mike, Mar 10, 2005, in forum: ASP .Net Web Controls
    Replies:
    4
    Views:
    261
    Sundararajan
    Mar 11, 2005
Loading...

Share This Page