my $q = new CGI ; #a cgi object

print $q->h3("Process");
print $q->html("Steps");

print qq{<FONT SIZE=-1><I>(Click on the hyperlinks in the 'task' column to see further information on methods [if available])</I></FONT><BR>\n};
  print qq{<FONT SIZE=-1><I>(Note: Hyperlinks to the <B>Command/Method</B> log files will not work on windows)</I></FONT><BR>\n};
  print qq{<TABLE BORDER=1 ><TR BGCOLOR="#D0D0D0">
    <TH ALIGN=LEFT>Task</TH><TH ALIGN=LEFT>Command</TH><TH ALIGN=LEFT>Method</TH><TH
	ALIGN=LEFT>Status</TH><TH ALIGN=LEFT>Task version</TH><TH ALIGN=LEFT>Tool version</TH><TH
	ALIGN=LEFT>Last changed</TH><TH ALIGN=LEFT>Comments</TH></TR> \n };

##</code><code>##

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('TABLE:has(th:contains("Status"))').attr('id','maintab');
$('th:contains("Status")').html('<select id="your_answer" name="your_answer" style="margin-bottom:5px"><option value="showAll">showAll</option><option value="onlyValidStatus">onlyValidStatus</option></select><br />Status');
$('#maintab td').each(function(){

if($(this).is(':first-child') && $(this).attr('rowspan')=='undefined'){
$(this).css('background-color','Red');
$(this).parent().addClass('hid');
}

if($(this).is(':nth-child(2)') && $(this).find('a').length==0){
$(this).parent().addClass('hid');
/* if you don't want not valid rows to be colorized
remove the two lines below or just comment these lines
*/
$(this).css('background-color','#f5f5f5');
$(this).siblings().css('background-color','#f5f5f5');
}

});
$('#your_answer').change(function(){
if($(this).val()=='onlyValidStatus'){$('.hid').css('display','none');}
if($(this).val()=='showAll'){$('.hid').css('display','TABLE-row');}
$(this).blur();
});
});
</script>