Click to See Complete Forum and Search --> : Even/Odd TR color...


weee
03-15-2006, 12:59 PM
I have a results page that uses a table.

How can I show the results and have different TR background colors for each TR? I'm talking about two colors only. Let's say white for the Even number of TR's and black for the Odd number of TR's.

Thanks!

lmf232s
03-15-2006, 03:38 PM
Wee,
Here is a really simple example. You can do this many ways. I have some simple functions for rowcolor and then i have functions that do the same thing but allow for onmouseover actions that hightlight the row a different color and then onmouseout change it back to its color as well as being able to click on the hightlighted row and take you to the details for that record.

Here is a simple example:
NOTE SPANcell2 and SPANcell4 are styles

Function RowColor(i)
if i mod 2 then
RowColor = "SPANcell2"
else
RowColor = "SpANcell4"
end if
end Function

''Depending on how you are creating your html.

i = 0
Do While Not oRS1.EOF
Response.write "<tr class=" & RowColor(i) & ">"
Response.write "<td>.......</td>"
Response.write "</tr>"
i = i + 1
oRS1.MoveNext
Loop

or

i = 0
Do While not oRS1.EOF
%>
<tr class="<%=RowColor(i)%>">
<td></td>
</tr>
<%
i = i + 1
oRS1.MoveNext
Loop

'You could even just do it like this
i = o
Do While not oRS1.EOF
if i mod 2 then
sColor = "SPANcell2"
else
sColor = "SpANcell4"
end if
Response.write "<tr class=" & sColor & ">"...................
i = i + 1
oRS1.MoveNext
Loop


You get the jist. I could do this many of different ways. The MOD function is the big one here because you can just pass it the value of I and base your row color off of that. You can create functions, subs, or just do it with in the code.

Hope that helps.

Ubik
03-16-2006, 05:24 PM
Easier way:

Define a css class for each color:

.alternate1{color:#00FF00}
.alternate0{color:#FFFF00}

<table>
<tr>
<td class="alternate<%=intRowNumber MOD 2%>">Content!</td>
</tr>
</table>

Less processor load. Content not mixed with design. You can change the css code to whatever you like.

weee
03-20-2006, 05:41 PM
Thanks!