Adding control dynamically from Code Behind - Dropdown, Listbox, Checkbox - asp.net

This tutorial/example shows how you can add control dynamically from code behind. This example not only limits to Dropdown, Listbox, and Checkbox controls, but you can use this example for any controls. The only things that you need to understand the process.

Step By Step

  1. Create one new project name DynamicControls
  2. Add One web form or webform using the master page if you use the default template master page.
  3. Copy-paste code below respectively. (Note: I'm using the default master page template from VS2010)

ASPX code

    <h3>
        This is Dynamic Control Tutorial
    </h3>

    <asp:Button ID="Button1" runat="server" Text="Add ListBox To Panel"
        onclick="Button1_Click" />
    <br />
    <asp:Button ID="Button2" runat="server" Text="Add Dropdown To Panel"
        onclick="Button2_Click" />
    <br />
    <asp:Button ID="Button3" runat="server" Text="Add CheckBox To Panel"
        onclick="Button3_Click" />
    <br />

    <asp:Panel GroupingText="Dynamic Control Added" ID="PanelToAddDynamicControl" runat="server">
    </asp:Panel>



Code Behind

    /// <summary>
    /// Control Type Enumeration
    /// </summary>
    public enum ControlType
    {
        DropDown, ListBox, Checkbox
    }

    public partial class DynamicControl : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!Page.IsPostBack)
            {
                //clear state if any
                ViewState.Remove("dropdown");
                ViewState.Remove("listbox");
                ViewState.Remove("checkbox");
            }
            else if (Page.IsPostBack)
            {
                //recreate if page is postback, this is because the original page dont have
                //Controls that we added through code behind, hence we need to re create the controls again
                if (ViewState["listbox"] != null)
                {
                    AddControl(ControlType.ListBox);
                }
                if (ViewState["dropdown"] != null)
                {
                    AddControl(ControlType.DropDown);
                }
                if (ViewState["checkbox"] != null)
                {
                    AddControl(ControlType.Checkbox);
                }
            }
        }
        public void AddControl(ControlType C)
        {
            List<ListItem> collectionOfItem = new List<ListItem>();
            for (int i = 0; i < 10; i++)
            {
                ListItem LItems = new ListItem();
                LItems.Text = "Item " + i.ToString();
                LItems.Value = "Item " + i.ToString();
                collectionOfItem.Add(LItems);
            }
            switch (C)
            {
                case ControlType.ListBox:
                    ListBox List = new ListBox();
                    List.ID = "ListBox1";
                    foreach (ListItem li in collectionOfItem)
                    {
                        List.Items.Add(li);
                    }
                    if (!(PanelToAddDynamicControl.FindControl("ListBox1") != null))
                        PanelToAddDynamicControl.Controls.Add(List);
                    break;
                case ControlType.DropDown:
                    DropDownList DropDown = new DropDownList();
                    DropDown.ID = "Dropdownlist1";
                    foreach (ListItem li in collectionOfItem)
                    {
                        DropDown.Items.Add(li);
                    }
                    if (!(PanelToAddDynamicControl.FindControl("Dropdownlist1") != null))
                        PanelToAddDynamicControl.Controls.Add(DropDown);
                    break;
                case ControlType.Checkbox:
                    CheckBoxList Checkbox = new CheckBoxList();
                    Checkbox.ID = "CheckBox1";
                    foreach (ListItem li in collectionOfItem)
                    {
                        Checkbox.Items.Add(li);
                    }
                    if (!(PanelToAddDynamicControl.FindControl("CheckBox1") != null))
                        PanelToAddDynamicControl.Controls.Add(Checkbox);
                    break;
            }
        }

        protected void Button1_Click(object sender, EventArgs e)
        {
            //Listbox
            AddControl(ControlType.ListBox);
            ViewState["listbox"] = true;
        }
        protected void Button2_Click(object sender, EventArgs e)
        {
            //Dropdown
            AddControl(ControlType.DropDown);
            ViewState["dropdown"] = true;
        }

        protected void Button3_Click(object sender, EventArgs e)
        {
            //checkbox
            AddControl(ControlType.Checkbox);
            ViewState["checkbox"] = true;
        }
    }


Output Example



Popular posts from this blog

Example to disable save as certain file type in SSRS Report Viewer

How to create DataGrid or GridView in JSP - Servlet

Control Webpart Visible/Enable using macro in Kentico