html - How to catch the value in a td element with jquery and change another td elements background color based on the caught td's value? -
i've spent time today looking @ examples iterate through table , rows jquery, after lot of trial error able it. running issue trying value td element, can change color of td element. have repeater bound datatable. markup looks this..
<div> <table id="table"> <tr> <th>global group </th> <th>option id </th> </tr> <tr> <asp:repeater id="repeater1" runat="server" onitemdatabound="repeater1_itemdatabound"> <itemtemplate> <tr align="left"> <td id="header"> <asp:label id="lbloptionname" runat="server" text='<%#eval("globalgroup_name") %>'></asp:label> </td> <td class="level"><%#eval("globalgroup_level")%></td> </tr> </itemtemplate> </asp:repeater> </tr> </table>
originally had label in td class=level, , able highlight wanted in onitemdatabound event. want jquery instead.
this came with...
$(document).ready(function () { $("#table tr").each(function () { var cell = $(this).find("td.level").text(); if (cell == "0") $("#header").css('background-color', 'purple'); }); })
this table data
global group option id floor 1 hardwood 1 parkay 1 handle 0 brass 1 stainless 1 nickel 1 door 0 hardwood 1 steel 1 screen 1
etc... been trying everytime option id 0, want have background color matching global group... i.e handle's option id 0, td element has handle in should have background color changed , on.
what code doing adding background color first td element under global group can see option id floor 1 , shouldn't have background color.
so can point out going wrong?
thanks
you want change background of header
element in same tr
current level
element so
$(document).ready(function () { $("#table tr").each(function () { var cell = $(this).find("td.level").text(); if (cell == "0") { $(this).find(".header").css('background-color', 'purple'); } }); })
also since id of element must unique, use header
class
<tr align="left"> <td class="header"> <asp:label id="lbloptionname" runat="server" text='<%#eval("globalgroup_name") %>'></asp:label> </td> <td class="level"> <%#eval( "globalgroup_level")%> </td> </tr>
in code, since using id selector find header element, return first element id header
Comments
Post a Comment