Sorteren op alfabet
Auteur: JQUERY - 27 augustus 2009 - 17:54 - Gekeurd door: Koen - Hits: 5799 - 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.