Sorteren op alfabet
Auteur: JQUERY - 27 augustus 2009 - 17:54 - Gekeurd door: Koen - Hits: 5779 - Aantal punten: 4.00 (3 stemmen)
Hallo allemaal!
Ik ben een website aan het maken dat je game kan opzoeken en nu heb ik een systeem waarbij dat kan: JQUERY . De onderstaande code is een aanpassing van de standaard code. Files zijn hier te downloaden: http://game.pivotroarmovies.com/sort/sort.zip
P.S. Dit script is trouwens niet van mij het is van JQUERY, ik heb het alleen aangepast.
*Update: Versie 1.1.3*
-Datum wordt correct gesorteerd.
|
Code: |
Het enigste wat je moet doen is een nieuw html document te maken met het volgende:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Sorteerder v 1.1</title>
<link rel="stylesheet" href="/css/jq.css" type="text/css" media="print, projection, screen" />
<link rel="stylesheet" href="/css/style.css" type="text/css" media="print, projection, screen" />
<script type="text/javascript" src="/jquery-latest.js"></script>
<script type="text/javascript" src="/jquery.tablesorter.js"></script>
<script type="text/javascript" src="/docs/js/chili/chili-1.8b.js"></script>
<script type="text/javascript" src="js/docs.js"></script>
<script type="text/javascript">
$(function() {
$("#tablesorter-demo").tablesorter({sortList:[[0,0],[2,1]], widgets: ['zebra']});
$("#options").tablesorter({sortList: [[0,0]], headers: { 3:{sorter: false}, 4:{sorter: false}}});
});
</script>
<table id="tablesorter-demo" class="tablesorter" border="0" cellpadding="0" cellspacing="1">
<thead>
<tr>
<th>Naam Game</th>
<th>Genre</th>
<th>Leeftijd</th>
<th>Datum uitgave</th>
</tr>
</thead>
<tbody>
<tr>
<td>Game A</td>
<td>Genre A</td>
<td>Leeftijd A</td>
<td>Datum A</td>
</tr>
<tr>
<td>Game B</td>
<td>Genre B</td>
<td>Leeftijd B</td>
<td>Datum B</td>
</tr>
<tr>
<td>Game C</td>
<td>Genre C</td>
<td>Leeftijd C</td>
<td>Datum C</td>
</tr>
<tr>
<td>Game D</td>
<td>Genre D</td>
<td>Leeftijd D</td>
<td>Datum D</td>
</tr>
<tr>
<td>Game E</td>
<td>Genre E</td>
<td>Leeftijd E</td>
<td>Datum E</td>
</tr>
</tbody>
</table>
</body>
</html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <link rel="stylesheet" href="/css/jq.css" type="text/css" media="print, projection, screen" /> <link rel="stylesheet" href="/css/style.css" type="text/css" media="print, projection, screen" /> <script type="text/javascript" src="/jquery-latest.js"></script> <script type="text/javascript" src="/jquery.tablesorter.js"></script> <script type="text/javascript" src="/docs/js/chili/chili-1.8b.js"></script> <script type="text/javascript"> $(function() { $("#tablesorter-demo").tablesorter({sortList:[[0,0],[2,1]], widgets: ['zebra']}); $("#options").tablesorter({sortList: [[0,0]], headers: { 3:{sorter: false}, 4:{sorter: false}}}); }); <table id="tablesorter-demo" class="tablesorter" border="0" cellpadding="0" cellspacing="1">
De onderstaande dingen zijn te downloaden op http://game.pivotroarmovies.com/sort/sort.zip (zie ook link onderaan pagina):
-/css/jq.css
-/css/style.css
-/jquery-latest.js
-/jquery.tablesorter.js
-/js/chili-1.8b.js
-/js/docs.js Download code (.txt)
|
|
|
Stemmen |
Niet ingelogd. |
|