Below is just another simple way to sort a table;
A working page can be found at
http://www.hgsweb.de/tablesort/
Code:
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript">
function sortUp(col){
var t=document.getElementById('s');
var first=true,prevref,nr=t.rows.length;
var ih,r1,r2,k,i,ref,ref1,j,sw,nc=t.rows[0].cells.length;
for(i=0;i<nr;i++){
if(t.rows[i].cells[col].tagName!=='TD'){
continue;
}
ref=t.rows[i].cells[col].textContent;
for(j=i+1,sw=-1,first=true;j<nr;j++){
if(t.rows[j].cells[col].tagName!=='TD'){
continue;
}
ref1=t.rows[j].cells[col].textContent;
if(ref1<ref){
if(first){
prevref=ref1;
first=false;
sw=j;
} else{
if(ref1<prevref){
prevref=ref1;
sw=j
}
}
}
}
if(sw>0){
r1=t.rows[i].cells;
r2=t.rows[sw].cells;
for(k=0;k<nc;k++){
ih=r1[k].innerHTML;
r1[k].innerHTML=r2[k].innerHTML;
r2[k].innerHTML=ih;
}
}
}
}
function sortDown(col){
var t=document.getElementById('s');
var first=true,prevref,nr=t.rows.length;
var ih,r1,r2,k,i,ref,ref1,j,sw,nc=t.rows[0].cells.length;
for(i=0;i<nr;i++){
if(t.rows[i].cells[col].tagName!=='TD'){
continue;
}
ref=t.rows[i].cells[col].textContent;
for(j=i+1,sw=-1,first=true;j<nr;j++){
if(t.rows[j].cells[col].tagName!=='TD'){
continue;
}
ref1=t.rows[j].cells[col].textContent;
if(ref1>ref){
if(first){
prevref=ref1;
first=false;
sw=j;
} else{
if(ref1>prevref){
prevref=ref1;
sw=j
}
}
}
}
if(sw>0){
r1=t.rows[i].cells;
r2=t.rows[sw].cells;
for(k=0;k<nc;k++){
ih=r1[k].innerHTML;
r1[k].innerHTML=r2[k].innerHTML;
r2[k].innerHTML=ih;
}
}
}
}
</script>
</head>
<body>
<pre>
Very simple way to sort a table just by comparing
the textContent of table cells.
Once rows must be swapped , only the innerHTML of their cells will be swapped.
In the source of this page you will find the scripts
</pre>
<table id="s" border="1">
<tr><th>Colum 0 <img src="sort-up.gif" onclick="sortUp(0);"><img src="sort-down.gif" onclick="sortDown(0);"></th>
<th>Colum 1 <img src="sort-up.gif" onclick="sortUp(1);"><img src="sort-down.gif" onclick="sortDown(1);"></th>
<th>Colum 2 <img src="sort-up.gif" onclick="sortUp(2);"><img src="sort-down.gif" onclick="sortDown(2);"></th></tr>
<tr><td>5</td><td>7</td><td>1</td></tr>
<tr><td>88</td><td>6</td><td>7</td></tr>
<tr><td>3</td><td>0</td><td>77</td></tr>
<tr><td>5</td><td>7</td><td>1</td></tr>
<tr><td>88</td><td>6</td><td>7</td></tr>
<tr><td>3</td><td>0</td><td>77</td></tr>
<tr><td>A</td><td>7</td><td>1</td></tr>
<tr><td>88</td><td>6</td><td>7</td></tr>
<tr><td>3</td><td>0</td><td>77</td></tr>
<tr><td>5</td><td>7</td><td>1</td></tr>
<tr><td>88</td><td>6</td><td>7</td></tr>
<tr><th>ZZZ</th><th>CCC</th><th>AAA</th></tr>
<tr><td>5</td><td>7</td><td>1</td></tr>
<tr><td>88</td><td>6</td><td>7</td></tr>
<tr><td>3</td><td>0</td><td>77</td></tr>
<tr><td>5</td><td>7</td><td>1</td></tr>
<tr><td>88</td><td>6</td><td>7</td></tr>
<tr><td>b</td><td>0</td><td>77</td></tr>
<tr><td>5</td><td>7</td><td>1</td></tr>
<tr><td>88</td><td>6</td><td>7</td></tr>
<tr><td>!</td><td>0</td><td>77</td></tr>
</table>
</body>
</html>
Before you post, read our: 
