Back to discussion

select matching <tr>s by title

Last post was 21 Apr 2008 at 11:15
javascript , xhtml Ireland
  • 12 years ago

    Hi. Could anyone please assist. I have a table with rows, some with the same title. When I click on one of these rows, I want all the rows with matching titles backgrounds to turn red.

    See code for table below:

    <table>
    <tr title="1"><td>1</td>"><td>Item 1</td></tr>
    <tr title="1"><td>1a</td>"><td>Item 1a</td></tr>
    <tr title="2"><td>2</td>"><td>Item 2</td></tr>
    <tr title="3"><td>3</td>"><td>Item 3</td></tr>
    </table>

    Thanks
    rze

    Report abuse
  • 12 years ago

    This should do it:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">

    <head>

    <title></title> <script type="text/javascript">

    window.onload = function() {

    var mainTable = document.getElementById("TableContainer")
    ,selectionCriterion = "1" /* what's inside the "title" attribute */
    ,selectedRowColor = "#FF0000" /* the color to apply to the selected row */
    ,AllRows = mainTable.getElementsByTagName("tr");

    for (var i = 0; i < AllRows.length; i++) {

    var selectedRows = AllRows[i];

    if (selectedRows.getAttribute("title") == selectionCriterion) {

    selectedRows.style.background = selectedRowColor;

    }

    }

    };

    </script>

    </head>

    <body>

    <table id="TableContainer">

    <tr title="1"><td>1</td><td>Item 1</td></tr>

    <tr title="1"><td>1a</td><td>Item 1a</td></tr>

    <tr title="2"><td>2</td><td>Item 2</td></tr>

    <tr title="3"><td>3</td><td>Item 3</td></tr>

    </table> </body>

    </html>

     

    hth

    Report abuse

Post a reply

Enter your message below

Sign in or Join us (it's free).

JavaScript forum discussion

JavaScript tutorials

Quick links

Recent activity

Contribute

Why not write for us? Or you could submit an event or a user group in your area. Alternatively just tell us what you think!

Web Development

Developer Jobs

Our tools

We've got automatic conversion tools to convert C# to VB.NET, VB.NET to C#. Also you can compress javascript and compress css and generate sql connection strings.

Cancel
“If Java had true garbage collection, most programs would delete themselves upon execution.” - Robert Sewell