2009-09-20 Dynamic user control list

2009-09-20 dynamic-user-control-list

# Title: Dynamic user control list
# Author: Mikael Lundin
# Link: http://blog.mikaellundin.name/2009/09/20/dynamic-user-control-list.html

IDynamicControlContainer.cs

public interface IDynamicControlContainer
{
    /// <summary>
    /// Deletes the specified control from the container
    /// </summary>
    /// <param name="control">The control.</param>
    void Delete(Control control);
}

NameList.cs

public partial class NameList : Page, IDynamicControlContainer
{
    protected void Page_Load(object sender, EventArgs e)
    {
        foreach (string id in LoadControlIdList())
        {
            Create(id);
        }
    }
 
    protected void AddButton_Click(object sender, EventArgs e)
    {
        Create(null);
    }
 
    public void Create(string id)
    {
        string targetId = id ?? Guid.NewGuid().ToString();
        var control = LoadControl("~/NameControl.ascx");
        control.ID = targetId;
 
        DynamicNameList.Controls.Add(control);
        SaveControlIdList();
    }
 
    public void Delete(Control control)
    {
        DynamicNameList.Controls.Remove(control);
        SaveControlIdList();
    }
 
    public void SaveControlIdList()
    {
        List idList = new List<string>();
        foreach (Control control in DynamicNameList.Controls)
        {
            idList.Add(control.ID);
        }
 
        ViewState["IdList"] = idList;
    }
 
    public string[] LoadControlIdList()
    {
        var list = (List<string>) ViewState["IdList"];
 
        if (list == null)
        {
            return new string[0];
        }
        return list.ToArray();
    }
}

Page.aspx

<div>
    <h1>Name list</h1>
    <asp:Button runat="server" Text="Add" OnClick="AddButton_Click" />
    <asp:PlaceHolder runat="server" ID="DynamicNameList" />
</div>

UserControl.ascx

<div class="name">
    <asp:Label runat="server" Text="Firstname" />:
    <asp:TextBox runat="server" ID="Firstname" />
    <asp:Button runat="server" Text="Delete" OnClick="DeleteButton_Click" />
</div>

UserControl.ascx.cs

protected void DeleteButton_Click(object sender, EventArgs e)
{
    ((IDynamicControlContainer)this.Page).Delete(this);
}