Coloring Table Rows

[Steve Dyke]

I am using jstl to build a table into my html page. One of the columns contains a priority number. I use javascript to read this number(innerHTML) and turn the rows specific colors. Is there a way to hide the column that I am using for priority. It does not affect anything just looks odd and really no need to display.

[Bear Bibeault]

Why wait until JavaScript can do it? Sounds like it'd be better handled in the JSP.

[Steve Dyke]

Bear Bibeault wrote:Why wait until JavaScript can do it? Sounds like it'd be better handled in the JSP.

Is there any way you can give some help on the correct coding.

Here is my jstl code There is a tenth array element(last column in table) no header exists for it. It is the coulmn that holds value I need to set row color:

<TABLE id="itemtable" border="5" width="808">
				<TBODY>
					<TR>
						<TH align="left">Index <INPUT type="checkbox" name="si1" value="0" onclick="setsortvalue(this.name,this.value)"></TH>
						<TH align="left" width="75" nowrap>Tool No <INPUT type="checkbox" name="si2" value="0" onclick="setsortvalue(this.name,this.value)"></TH>
						<TH align="left">Tool Code</TH>
						<TH align="left">Request Type</TH>
						<TH align="left">Part Name</TH>
						<TH align="left">Program</TH>
						<TH align="left">Location</TH>
						<TH align="left">Assigned</TH>
						<TH align="left">Requester</TH>
						<TH align="left">Date Requested <INPUT type="checkbox" name="si3" value="0" onclick="setsortvalue(this.name,this.value)"></TH>
						
					</TR>
					<TR>
						<TD colspan="10" bgcolor="blue" height="5"></TD>
					</TR>
		
					<%int y=2;%>
					<c:forEach var="itemName" items="${twoqueList}">

			
					<TR id="<%= y %>">
						<%int x=0;%>
						<c:forEach var="itemArrayList" items="${itemName}">

							<c:set var="rValue" scope="session"
							value="<%= String.valueOf(x) %>"></c:set>
					
							<c:choose>
								<c:when test="${rValue == '0'}">
							
									<TD id="<%= x %>">
										<INPUT type="button"
										value="${itemArrayList}" onclick="accessTWOForm(this.value)">
				
									</TD>
							
									<% x = x + 1; %>
								</c:when>
								<c:when test="${rValue == '1'}">
							
									<TD nowrap width="75" id="<%= x %>">${itemArrayList}</TD>

									<% x = x + 1; %>
								</c:when>
										
								<c:otherwise>
									<TD id="<%= x %>">${itemArrayList}</TD>

									<% x = x + 1; %>
								</c:otherwise>
							</c:choose>
						</c:forEach>


					</TR>
					<% y = y + 1; %>	
				</c:forEach>
			</TBODY>
			</TABLE>

[Bear Bibeault]

First things first. You are mixing scriptlets with JSTL. What's up with that? That's a recipe for disaster and just plain messy.

Why do you feel the need to resort to scriptlets? <c:set> will allow you to set and change scoped values. Also <c:forEach> can provide loop counts and indexes.

[Steve Dyke]

Bear Bibeault wrote:First things first. You are mixing scriptlets with JSTL. What's up with that? That's a recipe for disaster and just plain messy.

Why do you feel the need to resort to scriptlets? <c:set> will allow you to set and change scoped values. Also <c:forEach> can provide loop counts and indexes.

Can you elaborate a little on how to change the scriptlet code to achive what I need. I got this example from some else. I have used it a lot and seems to work. But I am always looking for better solutions.

[Keerthi Sagar]

Hi Steve,
While iterating if you got the required value in that column, add simply the following code.
========
%>
<script>document.getElementById('<%=y%>').style.display = none;</script>
<%
========
Here what I am doing is, closing the jsp scriptlet and adding a javascript code to hide the row.

Hope this works.

Regards,
Y. Keerthi Sagar.

[Paul Clapham]

To me that seems like an extremely round-about way to put a style="display:none" attribute on a TD tag. Why wouldn't you just plain put that attribute on the tag in the JSP?

[Eric Pascarello]

Keerthi Sagar wrote:Hi Steve,
While iterating if you got the required value in that column, add simply the following code.
========
%>
<script>document.getElementById('<%=y%>').style.display = none;</script>
<%
========
Here what I am doing is, closing the jsp scriptlet and adding a javascript code to hide the row.

Hope this works.

Regards,
Y. Keerthi Sagar.

Why would you use JavaScript to hide it like that? Just add the style attribute to it with display none. DOing it with JavaScript is bad for performance of the initial page load and it just looks fugly.

Eric

[Steve Dyke]

So now I have got the scriptlet code out of my JSTL code. How do I color the current row I am in based on the value of the last element of my foreach item?

This is what I have so far. in this condition I want to turn the row background red:

<c:when test="${status.count == 11}">
									<c:choose>
										<c:when test="${itemArrayList == 2}">
											
										</c:when>
									</c:choose>
									<TD style="display:none"></TD>

									
								</c:when>

[Bear Bibeault]

Either write the style attribute on the <tr> element, or assign it to a CSS class name that colors it.

Basically, you need to decide what the HTML should look like, and then make the JSP generate that.

[Steve Dyke]

Bear Bibeault wrote:Either write the style attribute on the <tr> element, or assign it to a CSS class name that colors it.

Will I use js to do that or is there another way after the <TR> tag hs been initialized to reference it with in the c:when tag?

Here is what I am attempting but getting an error "Object Required":

<TABLE id="itemtable" border="5" width="808">
				<TBODY>
					<TR>
						<TH align="left">Index <INPUT type="checkbox" name="si1" value="0" onclick="setsortvalue(this.name,this.value)"></TH>
						<TH align="left" width="75" nowrap>Tool No <INPUT type="checkbox" name="si2" value="0" onclick="setsortvalue(this.name,this.value)"></TH>
						<TH align="left">Tool Code</TH>
						<TH align="left">Request Type</TH>
						<TH align="left">Part Name</TH>
						<TH align="left">Program</TH>
						<TH align="left">Location</TH>
						<TH align="left">Assigned</TH>
						<TH align="left">Requester</TH>
						<TH align="left">Date Requested <INPUT type="checkbox" name="si3" value="0" onclick="setsortvalue(this.name,this.value)"></TH>
						
					</TR>
					<TR>
						<TD colspan="10" bgcolor="blue" height="5"></TD>
					</TR>
		
					
					<c:forEach var="itemName" items="${twoqueList}" varStatus="trstatus" step"1">

			
					<TR id="TR"+"${trstatus.count}">
						
						<c:forEach var="itemArrayList" items="${itemName}" varStatus="status" step="1">

							
					
							<c:choose>
								<c:when test="${status.count == 1}">
							
									<TD>
										<INPUT type="button"
										value="${itemArrayList}" onclick="accessTWOForm(this.value)">
				
									</TD>
							
									
								</c:when>
								<c:when test="${status.count == 2}">
							
									<TD nowrap width="75">${itemArrayList}</TD>

									
								</c:when>
								<c:when test="${status.count == 11}">
									<c:choose>
										<c:when test="${itemArrayList == 1}">
											<script>document.getElementById("TR"+"${trstatus.count}").style.color="red"</script>
										</c:when>
									</c:choose>
									<TD style="display:none"></TD>

									
								</c:when>
										
								<c:otherwise>
									<TD>${itemArrayList}</TD>

									
								</c:otherwise>
							</c:choose>
						</c:forEach>


					</TR>
						
				</c:forEach>
			</TBODY>
			</TABLE>

[Bear Bibeault]

NO JS! Just do it on the server. You have all the data there at your fingertips.

[Steve Dyke]

Bear Bibeault wrote:NO JS! Just do it on the server. You have all the data there at your fingertips.

Ok how do I get a referance to the current row that my JSTL is processing like I do in the js?

<script>document.getElementById("TR${rValue}").style.color="red"</script>

[Paul Clapham]

Your problem is obscured by a whole lot of diversions, but I think your question is this:

"I am generating a <tr> tag, and I want to set an attribute on this tag which makes the row be a certain colour, but I don't know what that colour is until after I have generated a whole lot more tags. So how do I set that attribute?"

Well, if it were me, I would do some more work in the part of your code (presumably it's a servlet) which puts information into the request context. Have it put the colour in a place where it's immediately accessible when you generate the TR tag.

Looks to me like you have put a list "twoqueList" in the request. And it looks like each entry in that list is simply a list of, um, let's just say somethings. I would change that so that each entry is a bean which contains two things: the colour of the row and the list of somethings.

[Steve Dyke]

Paul Clapham wrote:
Well, if it were me, I would do some more work in the part of your code (presumably it's a servlet) which puts information into the request context. Have it put the colour in a place where it's immediately accessible when you generate the TR tag.

Looks to me like you have put a list "twoqueList" in the request. And it looks like each entry in that list is simply a list of, um, let's just say somethings. I would change that so that each entry is a bean which contains two things: the colour of the row and the list of somethings.

This is my servlet code that generates my list of lists. The last element added has the color flag. What would I do here to fix it so the JSP could see the color flag at the time the row is defined(the first forEach loop):

GetTWOQueueDataConnection6 getQIR = new GetTWOQueueDataConnection6();
		getQIR.setQueueData(gConn.getAs400Conn(), p1, p2, p3, p4);
		
		session.setAttribute("quecount",getQIR.getQuecount());
		
		List itemArrayListBase = new ArrayList();
		session.setAttribute("twoqueList", itemArrayListBase);
		for (int i=0; i<getQIR.getQuelist().length ; i++){
			List itemArrayList = new ArrayList();
						
			itemArrayList.add(getQIR.getQuelist()[i][0].toString());
			itemArrayList.add(getQIR.getQuelist()[i][1].toString());
			itemArrayList.add(getQIR.getQuelist()[i][2].toString());
			itemArrayList.add(getQIR.getQuelist()[i][3].toString());
			itemArrayList.add(getQIR.getQuelist()[i][4].toString());
			itemArrayList.add(getQIR.getQuelist()[i][5].toString());
			itemArrayList.add(getQIR.getQuelist()[i][6].toString());
			itemArrayList.add(getQIR.getQuelist()[i][7].toString());
			itemArrayList.add(getQIR.getQuelist()[i][8].toString());
			itemArrayList.add(getQIR.getQuelist()[i][9].toString());
			itemArrayList.add(getQIR.getQuelist()[i][10].toString());
					
								
			itemArrayListBase.add(itemArrayList);
					
		}
		
		resultString = "{errorString: '" + getQIR.getErrorstring() + "'}";
			
		gConn.setAs400Close(gConn.getAs400Conn());
		arg1.getWriter().write(resultString);
	}