How do I alternate HTML table row colors using JSP?
My CSS looks something like:
tr.odd {background-color: #EEDDEE}
tr.even {background-color: #EEEEDD}
I want to use <c:forEach>
to iterate over a collection.
<c:forEach items="${element}" var="myCollection">
<tr>
<td><c:out value="${element.field}"/></td>
...
</tr>
</c:forEach>
I need an int count variable or boolean odd/even variable to track the row. Then my <tr>
tag would look something like:
<tr class="odd or even depending on the row">
Use the varStatus
attribute on your forEach
tag and JSTL will manage an instance of a javax.servlet.jsp.jstl.core.LoopTagStatus
for you in the variable name you specify.
You can then use a ternary operator to easily output the appropriate class name:
<c:forEach items="${element}" var="myCollection" varStatus="loopStatus">
<tr class="${loopStatus.index % 2 == 0 ? 'even' : 'odd'}">
...
</tr>
</c:forEach>
This JSTL primer from IBM has more information about the core
tag library and what it gives you.