deleting table cells with Javascript DOM

Megan's picture

She has: 11,421 posts

Joined: Jun 1999

I have a table that I've created dynamicly with Ajax. What I need to do now is remove some table cells when a certain form option is selected. Here is the page for reference;

http://www.housing.uwaterloo.ca/_testbed/calculator/calc_testAjax4.php

See how it creates the table cells on the right side based on the options you select? Now notice what happens when you change the term. It keeps adding on table cells. I need to remove all the existing table cells when the term option is selected. I don't think you need to know how the whole thing works because all of this part can be done in Javascript. Pretend that this is a regular page and we just want to click a button and remove all the table cells.

I can use [incode]document.getElementsByID('calculations').rows[/incode] to get all the rows in the table. then I can use [incode].cells[/incode] to get an array with the cells. Then I can use [incode].deleteCell()[/incode] to delete the cells. [incode].cells[/incode] and [incode].deleteCell()[/incode] are both methods of the table row.

How do I put this all together so I can loop through the rows array and apply the [incode].deleteCell()[/incode] method?

Note: I want to delete just the 's not the 's. Otherwise this would be much easier!

Thanks for any help Smiling

He has: 1,380 posts

Joined: Feb 2002

Is it necessary to actually delete them? Why not just make them hidden/invisible? I think that would be alot easier....

Megan's picture

She has: 11,421 posts

Joined: Jun 1999

I could do it that way but then I could end up with an unlimited number of table cells that are there but hidden.

He has: 1,380 posts

Joined: Feb 2002

Oh. Well, I've never actually deleted anything before, so...I can't actually help then.

My only thought, though, is why not dynamically write the cells as needed? Based on onClick (or other) events, you could use .innerHTML to write into the table, or div or whatever... that would, in theory, eliminate your need for deletion.

Megan's picture

She has: 11,421 posts

Joined: Jun 1999

I already did that with the ajax. It happens when you choose the term. The problem is that when you change the term the old table cells are still there. So now I'm trying to get rid of them.

He has: 1,380 posts

Joined: Feb 2002

Ok, I guess I'm just not following how your script works, and/or why it does certain things. So... I guess I'll drop out of this discussion for now.

hahah sorry

Megan's picture

She has: 11,421 posts

Joined: Jun 1999

That's okay, attempted help is better than no help at all Smiling

I'm getting Liam (JeevesBond) to sit down and go over it with me now.

Megan's picture

She has: 11,421 posts

Joined: Jun 1999

Well, actually, you were on the right track a little bit. We ended up deciding to have the whole table generated in PHP/AJAX. Then we can enclose it in a DIV tag and instead of removing individual table cells we can just clear the whole div and start again.

One of the reasons why I posted this here was because I couldn't find anything on a google search. If anyone else is searching for this they may come across our forum. I do this sometimes when I can't find anything on google - if it's not there then we have an opportunity to rank Smiling

He has: 1,380 posts

Joined: Feb 2002

Oh ok.

Well I'm glad I wasn't completely stupid... haha

They have: 426 posts

Joined: Feb 2005

Maybe save the option in a cookie or something, and have a variable...boolean. On = TD of=No td?

Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.