Retaining the color of a table row in the next page.

Forum Moderators: open

Message Too Old, No Replies

Retaining the color of a table row in the next page.

passion for java

12:11 pm on Jul 5, 2006 (gmt 0)

In the left side menu of a jsp file I have list like folders,inbox etc., in a table.
What I required is to highlight the selected link(<td>). The moment I click I am seeing the color is getting applied to it. But when the page is getting refreshed the highilighted color is lost.
When the page is getting reloaded the link is no more highlighted. What has to be done to retain the color of the row that has been clicked, after page refresh.

I wrote the following piece of code:

<table>
<tr>
<td onClick="changeColor(this.parentNode);"><a href="inbox.jsp">Inbox</a></td>
</tr>
<tr>
<td onClick="changeColor(this.parentNode);"><a href="drafts.jsp">Drafts</a></td>
</tr>
<tr>
</table>

Please help.

regards
Rk.

daveVk

1:10 pm on Jul 5, 2006 (gmt 0)

Use hidden input element(s) to store selection status. This value is preserved over refresh. Set value on selection, read and apply on page load.

passion for java

6:57 am on Jul 6, 2006 (gmt 0)

I do not a form name and a submit button. only a url.

daveVk

11:36 am on Jul 6, 2006 (gmt 0)

I this clearer

<html>
<head>
<script>
function doLoad() {
tr1.style.backgroundColor='white'
tr2.style.backgroundColor='white'
var selEl=document.getElementById( 'sel' );
if ( selEl.value!= '' ) {
var el=document.getElementById( selEl.value );
if ( el ) { el.style.backgroundColor='lightblue' }
}
}
function changeColor( id ){
document.getElementById( 'sel' ).value=id;
doLoad();
}
</script>
</head>
<body onload='javascript:doLoad();' >
<form action='#' >
<input type='hidden' id='sel' value='' >
</form>
<table>
<tr id='tr1' >
<td onClick="changeColor( 'tr1' );">Inbox</td>
</tr>
<tr id='tr2'>
<td onClick="changeColor( 'tr2' );">Drafts</td>
</tr>
<tr>
</table>
</body>