Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Update all <td> style

Status
Not open for further replies.

jcale4

Programmer
Aug 31, 2004
63
US
Hello!

How can i dynamically update the bgcolor of all <td> in a document without assigning id's to all the <td>'s?

I have a table which has data in the <td>'s that when pressed, the bgcolor of that <td> should change, referenced by 'this'. Problem is not highlighting the one they press, but "un" highlighting the previous one. I cant assign ID's to the <td>'s because it is an ASP page that depending upon the user, may not have all of the <td>'s the page has to offer.

Thanks!
 
one way:

Code:
var allCells = document.getElementsByTagName('td');
for ( var i = 0; i < allCells.length; i++ )
    allCells[i].style.backgroundColor = 'white';

*cLFlaVA
----------------------------
[tt]your mom goes to college[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
[banghead]
 
Keep a JavaScript variable handy to hold the currently checked cell.

Something like:

Code:
<td onclick='highlight(this)'>...</td>
...
<script>
var curr;

function highlight(td)
{
 if(curr)
  curr.className = '';

 curr = td; [i]//holds the cell so it knows what to UNhighlight next time[/i]
 td.className = 'highlight';
}
</script>

'hope that helps.

--Dave


~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
O Time, Strength, Cash, and Patience! [infinity]
 
Both excellent solutions, Thank you!

Before I could even check the thread, i had already figured out a solution - essentially the same solution as LookingForInfo. I'm storing the original <td> that was clicked in a global variable, then swapping them out when the next is pressed.

Thanks everyone!!
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top