Keep DropDownList and TextBox value of dynamically added rows in ASP.Net GridView

Hi lokendrasiriy,

For retaining the TextBox value you need to save the value in ViewState and set is inside the SetPreviousData method.

Refer below code sample and correct your code.

HTML

<asp:GridView ID="Gridview1" runat="server" ShowFooter="true" AutoGenerateColumns="false">
    <Columns>
        <asp:BoundField DataField="RowNumber" HeaderText="Row Number" ItemStyle-VerticalAlign="Top" />
        <asp:TemplateField HeaderText="Header 1" ItemStyle-VerticalAlign="Top">
            <ItemTemplate>
                <asp:DropDownList ID="DropDownList1" runat="server" Width="100px" AppendDataBoundItems="true">
                    <asp:ListItem Value="-1">Select</asp:ListItem>
                </asp:DropDownList>
                <div id="dvContents" style="display: none;">
                    <asp:TextBox ID="TextBox1" runat="server" Width="100px" />
                </div>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Header 2" ItemStyle-VerticalAlign="Top">
            <ItemTemplate>
                <asp:DropDownList ID="DropDownList2" runat="server" Width="100px" AppendDataBoundItems="true">
                    <asp:ListItem Value="-1">Select</asp:ListItem>
                </asp:DropDownList>
            </ItemTemplate>
            <FooterStyle HorizontalAlign="Right" />
            <FooterTemplate>
                <asp:Button ID="ButtonAdd" runat="server" Text="Add New Row" OnClick="ButtonAdd_Click" />
            </FooterTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script type="text/javascript">
    $(function () {
        $('[id*=DropDownList1]').change(function () {
            if ($(this).find('option:selected').text() == "Others") {
                $(this).closest('tr').find('[id*=dvContents]').show();
            } else {
                $(this).closest('tr').find('[id*=dvContents]').hide();
            }
        });

        $('[id*=Gridview1] tr:has(td)').each(function () {
            var tr = $(this).closest('tr');
            if ($(tr).find('[id*=DropDownList1] option:selected').text() == "Others") {
                $(tr).find('[id*=dvContents]').show();
            }
        });
    });
</script>

Namespaces

using System.Data;

Code

protected void Page_Load(object sender, EventArgs e)
{
    if (!this.IsPostBack)
    {
        SetInitialRow();
    }
}

protected void ButtonAdd_Click(object sender, EventArgs e)
{
    AddNewRowToGrid();
}

private ArrayList GetDummyData()
{
    ArrayList arr = new ArrayList();
    arr.Add(new ListItem("Item1", "1"));
    arr.Add(new ListItem("Item2", "2"));
    arr.Add(new ListItem("Item3", "3"));
    arr.Add(new ListItem("Item4", "4"));
    arr.Add(new ListItem("Item5", "5"));
    arr.Add(new ListItem("Others", "6"));
    return arr;
}

private void FillDropDownList(DropDownList ddl)
{
    ArrayList arr = GetDummyData();
    foreach (ListItem item in arr)
    {
        ddl.Items.Add(item);
    }
}

private void SetInitialRow()
{
    DataTable dt = new DataTable();
    DataRow dr = null;

    //Define the Columns
    dt.Columns.Add(new DataColumn("RowNumber", typeof(string)));
    dt.Columns.Add(new DataColumn("Column1", typeof(string)));
    dt.Columns.Add(new DataColumn("Column2", typeof(string)));
    dt.Columns.Add(new DataColumn("Column3", typeof(string)));

    //Add a Dummy Data on Initial Load
    dr = dt.NewRow();
    dr["RowNumber"] = 1;
    dt.Rows.Add(dr);

    //Store the DataTable in ViewState
    ViewState["CurrentTable"] = dt;
    //Bind the DataTable to the Grid
    Gridview1.DataSource = dt;
    Gridview1.DataBind();

    //Extract and Fill the DropDownList with Data
    DropDownList ddl1 = (DropDownList)Gridview1.Rows[0].Cells[1].FindControl("DropDownList1");
    DropDownList ddl2 = (DropDownList)Gridview1.Rows[0].Cells[2].FindControl("DropDownList2");
    FillDropDownList(ddl1);
    FillDropDownList(ddl2);
}

private void AddNewRowToGrid()
{
    if (ViewState["CurrentTable"] != null)
    {
        DataTable dtCurrentTable = (DataTable)ViewState["CurrentTable"];
        DataRow drCurrentRow = null;

        if (dtCurrentTable.Rows.Count > 0)
        {
            drCurrentRow = dtCurrentTable.NewRow();
            drCurrentRow["RowNumber"] = dtCurrentTable.Rows.Count + 1;
            //add new row to DataTable
            dtCurrentTable.Rows.Add(drCurrentRow);
            //Store the current data to ViewState
            ViewState["CurrentTable"] = dtCurrentTable;

            for (int i = 0; i < dtCurrentTable.Rows.Count - 1; i++)
            {
                //extract the DropDownList Selected Items
                DropDownList ddl1 = (DropDownList)Gridview1.Rows[i].Cells[1].FindControl("DropDownList1");
                DropDownList ddl2 = (DropDownList)Gridview1.Rows[i].Cells[2].FindControl("DropDownList2");
                TextBox txt1 = (TextBox)Gridview1.Rows[i].Cells[1].FindControl("TextBox1");

                // Update the DataRow with the DDL Selected Items
                dtCurrentTable.Rows[i]["Column1"] = ddl1.SelectedItem.Text;
                dtCurrentTable.Rows[i]["Column2"] = txt1.Text;
                dtCurrentTable.Rows[i]["Column3"] = ddl2.SelectedItem.Text;
            }

            //Rebind the Grid with the current data
            Gridview1.DataSource = dtCurrentTable;
            Gridview1.DataBind();
        }
    }
    else
    {
        ClientScript.RegisterClientScriptBlock(this.GetType(), "alert", "alert('ViewState is null');", true);
    }

    //Set Previous Data on Postbacks
    SetPreviousData();
}

private void SetPreviousData()
{
    int rowIndex = 0;
    if (ViewState["CurrentTable"] != null)
    {
        DataTable dt = (DataTable)ViewState["CurrentTable"];
        if (dt.Rows.Count > 0)
        {
            for (int i = 0; i < dt.Rows.Count; i++)
            {
                //Set the Previous Selected Items on Each DropDownList on Postbacks
                DropDownList ddl1 = (DropDownList)Gridview1.Rows[rowIndex].Cells[1].FindControl("DropDownList1");
                DropDownList ddl2 = (DropDownList)Gridview1.Rows[rowIndex].Cells[2].FindControl("DropDownList2"); 
                TextBox txt1 = (TextBox)Gridview1.Rows[i].Cells[1].FindControl("TextBox1");

                //Fill the DropDownList with Data
                FillDropDownList(ddl1);

                if (i < dt.Rows.Count - 1)
                {
                    ddl1.ClearSelection();
                    ddl1.Items.FindByText(dt.Rows[i]["Column1"].ToString()).Selected = true;

                    ddl2.ClearSelection();
                    ddl2.Items.FindByText(dt.Rows[i]["Column3"].ToString()).Selected = true;
                }
                //Fill the TextBox with text
                txt1.Text = dt.Rows[i]["Column2"].ToString();

                rowIndex++;
            }
        }
    }
}

Screenshot