Varying CSS by odd/even entries

misterg2 24 Aug, 2012
I am trying to forat the list of items using ChronoConnectivity. Here is my code

<!-- Javascript goes in the document HEAD -->
<script type="text/javascript">
function altRows(id){
	if(document.getElementsByTagName){  
		
		var table = document.getElementById(id);  
		var rows = table.getElementsByTagName("tr"); 
		 
		for(i = 0; i < rows.length; i++){          
			if(i % 2 == 0){
				rows[i].className = "evenrowcolor";
			}else{
				rows[i].className = "oddrowcolor";
			}      
		}
	}
}

window.onload=function(){
	altRows('alternatecolor');
}
</script>


<!-- CSS goes in the document HEAD or added to your external stylesheet -->
<style type="text/css">
table.altrowstable {
	font-family: verdana,arial,sans-serif;
	font-size:11px;
	color:#333333;
	border-width: 1px;
	border-color: #a9c6c9;
	border-collapse: collapse;
}
table.altrowstable th {
	border-width: 1px;
	padding: 8px;
	border-style: solid;
	border-color: #a9c6c9;
}
table.altrowstable td {
	border-width: 1px;
	padding: 8px;
	border-style: solid;
	border-color: #a9c6c9;
}
.oddrowcolor{
	background-color:#d4e3e5;
}
.evenrowcolor{
	background-color:#c3dde0;
}
</style>


<h1 align="center" > Members' Interests</h1>
<table class="altrowstable" id="alternatecolor" cellpadding="10" align="center" >
<thead>
<tr>
<th>Member No</th><th>Surname</th><th>Area</th><th>From</th><th>To</th>
</tr>
</thead>
<tfoot>
<tr>
<td colspan='5' style='height:4px; background:silver;'></td>
</tr>
</tfoot>
<tbody>


This is in the header and I display the info using this in the body

<tr><td>{Member_No}</td><td>{Surname}</td><td>{Area}</td><td>{From_Date}</td><td>{To_Date}</td></tr>
It appears that the javascript is not working - any ideas - or is there a different way to get the correct odd/even formating ?
GreyHead 25 Aug, 2012
Hi misterg2,

I think that you can do this with PHP and avoid the JavaScript.

In the header box add
<?php
global $odd_even;
$odd_even = 1;
?>

And modify the Body box to be like this
<?php
$class = 'evenrowcolor';
if ( $odd_even == 1 );
  $class = 'oddrowcolor';
}
$odd_even = 1 - $odd_even;
?>
<tr class='<?php echo $class; ?>'><td>{Member_No}</td><td>{Surname}</td><td>{Area}</td><td>{From_Date}</td><td>{To_Date}</td></tr>


Bob
This topic is locked and no more replies can be posted.