How to create dynamic textbox dropdown list in asp.net

asp.net

I want to create dynamic 2 textbox and 2 dropdownlist below each textbox and dropdownlist in button click.
This is the code i am using which creates dynamic textbox and dropdownlist but its creating control in horizontal way.I want creation of dynamic controls in a vertical manner which will be coming under textbox and dropdown.

 <div id="dvContainer" runat="server">

 <table align="center" cellpadding="0" cellspacing="0" width="90%">
    <tr>
    <td>
        <table width="100%">
            <tr>
                <td align="center">Date</td>
                <td>
                    <asp:TextBox ID="TextBox1" runat="server" Width="150px">              </asp:TextBox>
                </td>
                <td align="center">Time</td>
                <td>
                    <asp:TextBox ID="TextBox2" runat="server" Width="150px"></asp:TextBox>
                </td>
                <td align="center">Godown</td>
                <td>
                    <asp:DropDownList ID="DropDownList1" runat="server" Width="150px">
                    </asp:DropDownList>
                </td>
            </tr>
        </table>
    </td>
    </tr>

 <tr>
    <td><table width="100%">
            <tr>
                <td align="center">Item</td>
                <td align="center">QTY</td>
                <td align="center">Unit</td>
                <td align="center">Available</td>
                <td align="center"></td>

            </tr>
            <tr>
                <td align="center">
                    <asp:DropDownList ID="DropDownList2" runat="server" Width="150px">
                    </asp:DropDownList>
                </td>
                <td align="center">
                    <asp:TextBox ID="TextBox3" runat="server" Width="150px"></asp:TextBox>
                </td>
                <td align="center">
                    <asp:DropDownList ID="DropDownList3" runat="server" Width="150px">
                    </asp:DropDownList>
                </td>
                <td align="center">
                    <asp:TextBox ID="TextBox4" runat="server" Width="150px"></asp:TextBox>
                </td>
                 <td align="center">
                     <asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
                </td>

            </tr>

        </table></td>
    </tr>

</table>

</div>

This is the code i am using in cs page

public partial class StockEntry : System.Web.UI.Page
{
    protected System.Web.UI.WebControls.DropDownList Ddl_Item;
    protected System.Web.UI.WebControls.TextBox Txt_Quantity;
    protected System.Web.UI.WebControls.DropDownList Ddl_Unit;
    protected System.Web.UI.WebControls.TextBox Txt_Available;

    protected void Page_Load(object sender, EventArgs e)
    {

    }

    int countTimes = 0;

    protected void Button1_Click(object sender, EventArgs e)
    {
        if (ViewState["countTimes"] == null)
        {
            countTimes = 1;
        }
        else
        {
            countTimes = Convert.ToInt32(ViewState["countTimes"]);
        }

        for (int i = 0; i < countTimes; i++)
        {
            Ddl_Item = new DropDownList();
            Ddl_Item.ID = "Ddl_Item" + i;
            Ddl_Item.Width = 180 + i;

            Txt_Quantity = new TextBox();
            Txt_Quantity.ID = "Txt_Quantity" + i;
            Txt_Quantity.Width = 180 + i;

            Ddl_Unit = new DropDownList();
            Ddl_Unit.ID = "Ddl_Unit" + i;
            Ddl_Unit.Width = 180 + i;

            Txt_Available = new TextBox();
            Txt_Available.ID = "Txt_Available" + i;
            Txt_Available.Width = 180 + i;

            dvContainer.Controls.Add(Ddl_Item);
            dvContainer.Controls.Add(Txt_Quantity);

            dvContainer.Controls.Add(Ddl_Unit);
            dvContainer.Controls.Add(Txt_Available);

        }
        countTimes = countTimes + 1;

        ViewState.Add("countTimes", countTimes);
    }
}

Best Answer

You can add controlls dynamically by two ways

1.By client side, use javascript for more info

2.By Server side, use literal controls

Related Topic