We help IT Professionals succeed at work.

Tyring to dynamically add and delete rows in an asp.net table.

metta0_3
metta0_3 asked
on
Medium Priority
263 Views
Last Modified: 2013-12-17
Using C# and asp.net. I have a table with ten dynamically added rows each containing values 0 through to 9.

I want to try to be able to add a row to the top containing new contents and then delete from the bottom everytime I click a button. This only happens the first time at present. Although the event handler does still execute on the second click.

 I am using dateTime object for the example. When button is first clicked the current dateTime is added and the last row is removed, in this instance the value 9. So everything is moved up successfully. On the second attempt this same procedure is expected and desired, though it is not performed. What happens is the dateTime is updated in the first row and thats is. What I am trying to get is for everything to be moved up one row. Therefore there would be two dateTimes displayed in the first two columns and then initial row 8 and 9 will have been removed.

Code example below, can do this in Javascript, however I would like to try to achieve the same effect on server side to reduce overheads. Any help would be greatly appreciated.
Here is aspx code:
 
<asp:Table ID="tblTemp" runat="server" CssClass="myTable"></asp:Table>   
<asp:Button ID="Button1" runat="server" Text="Click Me!" OnClick="btnClick" CssClass="myButton"/>
 
Here is the aspx.cs code behind:
 
 protected void Page_Load(object sender, EventArgs e)
    {
        int counter = 0;
        while (counter <= 9)
        {
            TableRow trRow = new TableRow();
            TableCell tcCell = new TableCell();
            tcCell.CssClass = "myCells";
            
 
            tcCell.Text = counter.ToString();
            trRow.Controls.Add(tcCell);
 
            tblTemp.Controls.Add(trRow);
            counter += 1;
        }
    }
 
    protected void btnClick(object sender, EventArgs e)
    {
        DateTime current = DateTime.Now;
 
        TableRow trRow = new TableRow();
        TableCell tcCell = new TableCell();
        tcCell.CssClass = "myCells";
        tcCell.Text = current.ToString();
        trRow.Controls.Add(tcCell);
        tblTemp.Controls.AddAt(0, trRow);
        tblTemp.Controls.RemoveAt(9);
    }

Open in new window

Comment
Watch Question

I think all you have to do is change your last two lines to (check order):

tblTemp.Rows.RemoveAt(9);
tblTemp.Rows.AddAt(0, trRow);

In your original code you were adding the row first which would change your indexes to 0-10 because you now have eleven rows.  So you can change the order of the statements or change your RemoveAt call to RemoveAt(10)

Author

Commented:
Thanks for the advice. That was an oversight on my part. However, it does not resolve the issue. If I click the button a second time it does not it does not push everything up once again. I'm trying to make continuous so that eveytime button is clicked rows are shifted up one and last one removed and new one added at the front.
I think your problem may be your Page_Load code.  Try wrapping everything in an if statement

if (!IsPostBack)
{
     ....Your page_load code
}

Not the solution you were looking for? Getting a personalized solution is easy.

Ask the Experts
You need to check IsPostBack if you don't want your table reset on every post back, only the first time the page is loaded.

Author

Commented:
Thanks you a star! Resolved it.
Access more of Experts Exchange with a free account
Thanks for using Experts Exchange.

Create a free account to continue.

Limited access with a free account allows you to:

  • View three pieces of content (articles, solutions, posts, and videos)
  • Ask the experts questions (counted toward content limit)
  • Customize your dashboard and profile

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.