Rabu, 13 Juni 2012

Pemrograman Web JQuery : Mengurutkan Sorting Tabel dengan JQuery

Maaf kalau kurang lengkap dan tidak jelas. Ini sepotong program yang ternyata dahsyat, mampu mengurutkan data dalam tabel <table> HTML tanpa harus diurutkan dahulu oleh PHP. Sangat praktis untuk mengurutkan data hasil pengolahan tanpa harus dimasukkan ke database untuk di ORDER BY terlebih dahulu, atau tanpa harus memakai algoritma sorting array. Maaf terburu-buru, asal masuk blog dulu.

<script type="text/javascript" src="js/jquery-1.2.6.min.js"></script>
<script type="text/javascript" src="js/jquery.tablesorter.js"></script>
<script type="text/javascript">
var $jQ = jQuery.noConflict();
$jQ(document).ready(function() {
// Jquery Sorter
$jQ("table#perangkingan").tablesorter({ sortList: [[6, 1]] });
});
</script>
<table id='perangkingan' class='yui' width='100%'>
<thead>
<tr bgcolor='#6BA2CC'>
<th width='13%'> No </th>
<th width='40%'> Nama Pendaftar </th>
<!--th width='8%'> C1 </th>
<th width='8%'> C2 </th>
<th width='8%'> C3 </th>
<th width='8%'> C4 </th>
<th width='15%'> Total Skor </th-->
</tr>
</thead>
<tbody>
<tr>
<td> 1 </td>
<td> A </td>
<td> 10 </td>
<td> 20 </td>
<td> 15 </td>
<td> 15 </td>
<td> 15 </td>
</tr>

                <tr>
<td> 2 </td>
<td> B </td>
<td> 0 </td>
<td> 10 </td>
<td> 5 </td>
<td> 5 </td>
<td> 5 </td>
</tr>
</tbody>
</table> <br />

Keterangan <br />
C1 : Bobot UN <br />
C2 : Tes Teori <br />
C3 : Prestasi Non Akademik <br />
C4 : Tes Kesehatan <br />

Semoga suatu saat bisa bermanfaat.