sort
<table class="sortable">
<thead>
<tr>
<th></th>
<th class="sort-alpha">Tile</th>
<th>Authors</th>
<th>Publish</th>
<th>Price</th>
</tr>
<tbody>
<tr>
<td><img src=""></td>
<td>Building Website with Joomla</td>
<td>Hagen Graf</td>
<td>Feb 2007</td>
<td>$41.32</td>
</tr>
<tr>
<td><img src=""></td>
<td>Learning Manbo</td>
<td>Douglas Paterson</td>
<td>Feb 2006</td>
<td>$23.32</td>
</tr>
</tbody>
</thead>
$(document).ready(function(){
var alternaterRpwColors = function(){
$('tbody tr:odd',$table).removeClass('even').addClass('odd');
$('tbody tr:even',$table).removeClass('odd').addClass('even');
};
$('table.sortable').each(function(){
var $table = $(this);
alternaterRpwColors($table);
$('th'.$table).each(function(column){
if($(this).is('.sort-alpha')){
$(this).addClass('clickable').hover(function(){
$(this).addClass('hover');
}.function(){
$(this).removeClass('hover');
}).click(function(){
var row = $table.find('tbody > tr').get();
row.sort(function(a,b){
var keyA = $(a).children('td').eq(colum).text().toUpperCase();
var keyB = $(b).children('td').eq(colum).text().toUpperCase();
fi(keyA < keyB) return -1;
if(keyA > keyB) return 1;
return 0;
});
$.each(row,function(index,row){
$table.children('tbody').append(row);
});
alternaterRpwColors($table);
});
}
});
});
});