How to highlight rows on link click?

Discussion in 'JavaScript' started by AHA7, May 23, 2007.

0
  1. #1
    Hello,

    I have an HTML table with many rows and columns with each row containing info about one specific item and a delete link (there is a delete link for each row). What I want to do is to highlight the whole row (<tr> element) in the table (with a different background color) when I click on the delete link of that row (the new page opens in a new window.)

    My question is:
    How do I highlight (by changing the bg color for the whole <tr> element or -if that's not possible- all of that row's <td> elements) the row if I have clicked the delete link in that row. I want the row to stay highlighted so that I would know what rows were deleted.
    I guess this'll require id-specific actions applied to the row <tr> or all of its cells with an onclick event in that rows delete link.
     
    AHA7, May 23, 2007 IP
  2. AHA7

    AHA7 Peon

    Messages:
    445
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Just found it!

    Hope someone finds it useful.

    <html>
<head>
<script type="text/javascript">
function visited(a) {
  tr = a.parentNode.parentNode;
  tr.style.backgroundColor = "red";
}
</script>
</head>
<body>
<table>
 <tr>
  <td>This row will be highlighted in red after you...</td>
  <td>Click on the following link</td>
  <td><a href="http://google.com" target="_blank" onclick="visited(this)">Google</a></td>
 </tr>
</table>
</body>
</html>
    HTML:
     
    AHA7, May 24, 2007 IP