<html>
<head>
<title>Sorting Table Demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF" text="#000000">
<script language="JavaScript">
function SortBy(field, order) {
document.getElementById('SortBy').value = field;
document.getElementById('Order').value = order;
document.getElementById('fsort').submit();
}
</script>
<h1 align="center">Sorting Table</h1>
<p align="center">With combined by Javascript, sorting algorithm in table data
is more elegant.</p>
<table width="90%" border="1" cellspacing="0" cellpadding="3" align="center" bordercolor="#000000">
<tr>
<th>No</th>
<th><a href="javascript:SortBy('Name', '{$ordername$}')">Name</a>
<!--if:[showimg1]=[imgname != '']-->
<img src="{$imgname$}.bmp" align="baseline">
<!--/if:[showimg1]-->
</th>
<th><a href="javascript:SortBy('Address', '{$orderaddr$}')">Address</a>
<!--if:[showimg2]=[imgaddr != '']-->
<img src="{$imgaddr$}.bmp" align="baseline">
<!--/if:[showimg2]-->
</th>
<th><a href="javascript:SortBy('City', '{$ordercity$}')">City</a>
<!--if:[showimg3]=[imgcity != '']-->
<img src="{$imgcity$}.bmp" align="baseline">
<!--/if:[showimg3]-->
</th>
<th><a href="javascript:SortBy('staten', '{$orderstate$}')">State</a>
<!--if:[showimg4]=[imgstate != '']-->
<img src="{$imgstate$}.bmp" align="baseline">
<!--/if:[showimg4]-->
</th>
<th><a href="javascript:SortBy('Email', '{$orderemail$}')">Email</a>
<!--if:[showimg5]=[imgemail != '']-->
<img src="{$imgemail$}.bmp" align="baseline">
<!--/if:[showimg5]-->
</th>
<th><a href="javascript:SortBy('Birthday', '{$orderbirth$}')">Birthday</a>
<!--if:[showimg6]=[imgbirth != '']-->
<img src="{$imgbirth$}.bmp" align="baseline">
<!--/if:[showimg6]-->
</th>
</tr>
<!--loop:[row]-->
<tr>
<td align="center">{$no$}</td>
<td>{$rowName$}</td>
<td>{$rowAddress$}</td>
<td>{$rowCity$}</td>
<td>{$rowstaten$}</td>
<td>{$rowEmail$}</td>
<td>{$rowBirthday$}</td>
</tr>
<!--/loop:[row]-->
</table>
<form id="fsort" method="post" action="">
<input type="hidden" name="sortby" id="SortBy" value="">
<input type="hidden" name="order" id="Order" value="">
</form>
</body>
</html>