[appfuse-user] DisplayTag coloring individual rows

[Travers Snyman]

Hi,

I have a requirement for one of my use cases using displaytag library to
color individual rows according to certain column values. I implemented
this with javascript as below. My problem is that the coloring only
applies to the even rows. It looked like it had to do with the row
highlighting, so I removed the script calling highlightTableRows, but
the highlighting still occurs and only even rows get colored. Is there
another way to disable row highlighting or am I barking up the wrong
tree ?

 

Tx 

Travers

 

 

 

 

display:table name="timeZoneList" cellspacing="0" cellpadding="0"

    id="timeZoneList" pagesize="10" class="table timeZoneList"

    export="true" requestURI="" >

    <display:column property="id" sortable="true" headerClass="sortable"

        url="/editTimeZone.html" paramId="id" paramProperty="id"

        titleKey="timeZoneForm.id" />

    <display:column property="name" sortable="true"
headerClass="sortable"

         titleKey="timeZoneForm.name"/>

     <display:setProperty name="paging.banner.item_name" value="item"/>

    <display:setProperty name="paging.banner.items_name" value="items"/>

</display:table>

 

<c:out value="${buttons}" escapeXml="false"/>

 

 

<script type="text/javascript">

 

      function setColor(tableId) {

          var table = document.getElementById(tableId);

          var tbody = table.getElementsByTagName("tbody")[0];

        var rows = tbody.getElementsByTagName("tr");

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

              var value =
rows[i].getElementsByTagName("td")[1].firstChild.nodeValue;

              if (value == "Peak"){

                   rows[i].style.backgroundColor = "red";

              }

              if (value == "Off Peak"){

                   rows[i].style.backgroundColor = "blue";

              }

          }

      }

    

    setColor("timeZoneList");

 </script>