Add rows to a table dynamically

Question

At the moment I am trying to create a table whose content is supposed to be created by a subclass (result of querying a RESTful web service). I have been working for quite some time on that now and I just cannot seem to get it to work. I have tried so many different solutions.

• creating the table in the subclass and add it to Page.Controls. That gets me "The Controls collection cannot be modified because the control contains code blocks (ie <% ... %>)." which does not make sense at all.
• I have tried to create an empty table on the page and passed its handle to the subclass which was responsible for adding rows. Noting happened.
• I have tried to return a TableRowCollection and assigned it to the previously created (empty) table. Nothing happened.

• Now I just want to add one row and one cell to the table (baby steps towards what I need). Not even that works. Please find the code for that attached:

   TableRow row = new TableRow(); table.Rows.Add(row); TableCell cell = new TableCell(); row.Cells.Add(cell); cell.Controls.Add(new TextBox()); 

The table is simple and empty:

<asp:Table ID="table" runat="server" /> 

The source code that is displayed by my browser looks like that:

<table id="table">
</table> 

I have been looking at countless examples on the web and all look like this. I guess it is only a tiny problem somewhere but I have not been able to figure it out. Now I am willing to offer life-long gratitude to everybody who can provide the hint for solving this mess.

Answer 1

It is working, I have tested it:

In my page load, I have:

 protected void Page_Load(object sender, EventArgs e)
        {
            TableRow row = new TableRow();
            TableCell cell = new TableCell();
            cell.Controls.Add(new TextBox());
            row.Cells.Add(cell);
            table.Rows.Add(row);
        }

On my aspx page, I have:

<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <asp:Table ID="table" runat="server" /> 
</asp:Content>

The html rendered by this code:

<table id="MainContent_table">
    <tbody><tr>
        <td><input name="ctl00$MainContent$ctl00" type="text"></td>
    </tr>
</tbody></table>

Answer 2

I would use either an asp:GridView or an asp:Repeater

eg with Repeater

    <table>
        <asp:Repeater id="repeater1" runat="server">
            <ItemTemplate>
                <tr>
                    <td><asp:Literal id="literal1" runat="server" /></td>
                </tr>
            </ItemTemplate>
        </asp:Repeater>
    </table>

then in your code behind

repeater1.DataSource = myDatasource;
repeater1.DataBind();

or you could use a GridView

using table.Rows.Add() will tend to cause you problems, particularly with disappearing content on postback, or problems with event handlers not firing should you need to add any LinkButtons or anything like that to your table cells

Answer 3

The question is where are you adding these rows in the table, I mean in which event of page?

As I feel that post back is clearing all the added rows.

Kindly tell the execution sequence and also try to put your code in page_init event for adding rows.

Answer 4

Might solve your problem.
Make table runat="server" in your aspx code
<table id="tbl" runat="server">
</table> 



    protected void Page_Load(object sender, EventArgs e)
        {
                  if(!IsPostBack)
              {
            TableRow tr = new TableRow();

            TableCell tc = new TableCell();
            TextBox txtBox = new TextBox();

            // Add the control to the TableCell
            tc.Controls.Add(txtBox);
            // Add the TableCell to the TableRow
            tr.Cells.Add(tc);

            // Add the TableRow to the Table
            tbl.Rows.Add(tr);
                  }

        }