How to add new ASP.NET table row by clicking button?

I am using asp.net [ c# ] ..

My question is about adding new row; if I click on that button (like every time I click on that button it will add new row) ..
I thought its easy to do it .. but it is not there. Something is missing I don’t know what.

My code is [ Default3.aspx ] :

<%@ Page Language="C#" AutoEventWireup="true"
    CodeFile="Default3.aspx.cs" Inherits="Default3" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div align="center">     

<asp:Table ID="Table1" runat="server">
    <asp:TableRow>
        <asp:TableCell style="border-style:solid" >
           <asp:Label ID="Label1" runat="server" Text="LABEL = 1 ">
           </asp:Label>
        </asp:TableCell>
        <asp:TableCell style="border-style:solid" >
           <asp:Label ID="Label2" runat="server" Text="LABEL = 2 ">
           </asp:Label>
        </asp:TableCell>
    </asp:TableRow>
    <asp:TableRow>
        <asp:TableCell style="border-style:solid" >
           <asp:Label ID="Label3" runat="server" Text="LABEL = 3 ">
           </asp:Label>
        </asp:TableCell>
        <asp:TableCell style="border-style:solid" >
           <asp:Label ID="Label4" runat="server" Text="LABEL = 4 ">
           </asp:Label>
        </asp:TableCell>
    </asp:TableRow>
</asp:Table>

<asp:Button ID="Button1" runat="server" Text="Add More" 
        onclick="Button1_Click" />
</div>
</form>

</body>
</html>

and for my C# [ Default3.aspx.cs ] :

protected void Button1_Click(object sender, EventArgs e)
{

    TableRow NewRow1 = new TableRow();

    //1st cell
    TableCell NewCell1 = new TableCell();
    NewCell1.Style.Add("border-style","solid");

    // new lebel
    Label newLable1 = new Label();
    count = count + 1; // just for change number in label text 
    newLable1.Text = "NewLabel = "+ count;

    // adding lebel into cell
    NewCell1.Controls.Add(newLable1);

    // adding cells to row
    NewRow1.Cells.Add(NewCell1);

    //2ed cell
    TableCell NewCell2 = new TableCell();
    NewCell2.Style.Add("border-style", "solid");

    Label newLable2 = new Label();
    count = count + 1;
    newLable2.Text = "NewLabel = " + count;
    NewCell2.Controls.Add(newLable2);
    NewRow1.Cells.Add(NewCell2);

    //adding row into table
    Table1.Rows.Add(NewRow1);


}

I don’t know what the problem is .. I even give each controls an IDs .. and I tried other ways but didn’t work ..

Please if anyone can help me out .. I feel like am missing something important but I don’t know what it is ..

Contents hide

Answers:

Method 1

Method 2

Method 3

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

As given in the Question shared in Walid’s answer, follow these steps:

Create a global list of table rows, something like:
```
List<TableRow> TableRows
```

In button click Add the newly created row to list:

TableRow row1=new TableRow();
TableRows.add(row1);

In the OnInit method simply add all the rows to the table:

foreach ( TableRow row in TableRows )
{
    Table1.Rows.Add(row);
}

It will solve your problem.

Method 2

You will need to persist the state of your control (table).

See a clear explanation to a very similar problem here ASP.NET dynamically created controls and Postback

Method 3

You can add row just by using:

TableRow row1=new TableRow();
TableRows.add(row1);

But the concern is:

Clicked on Button, a row is added to table.
Clicked on the same button again then first row which you have already created no longer persists as ASP.NET is Stateless.

Solution: Ensure that on every button click, your already created rows data exists.

All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

0 0 votes

Article Rating