05/07/2010, 21:38:51
C'est hyper simple :Tu trouveras tout le nécessaire (images, css et js) ici : http://www.novell.com/communities/files/...xample.zip
Code :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-us">
<head>
<title>jQuery plugin: Tablesorter 2.0</title>
<link rel="stylesheet" href="./css/style.css" type="text/css" />
<script type="text/javascript" src="./js/jquery-1.3.1.min.js"></script>
<script type="text/javascript" src="./js/jquery.tablesorter.js"></script>
<script type="text/javascript" src="./js/jquery.tablesorter.pager.js"></script>
</head>
<body>
<table id="insured_list" class="tablesorter">
<thead>
<tr>
<th>Last Name</th>
<th>First Name</th>
<th>Email</th>
<th>Age</th>
<th>Premium Amount</th>
</tr>
</thead>
<tbody>
<tr>
<td>Mendes</td>
<td>Domnic</td>
<td>domnic@gmail.com</td>
<td>29</td>
<td>5500</td>
</tr>
<tr>
<td>Bharne</td>
<td>Sagar</td>
<td>sbharne@yahoo.com</td>
<td>25</td>
<td>4500</td>
</tr>
<tr>
<td>Rambo</td>
<td>John</td>
<td>sylvester@hotmail.com</td>
<td>60</td>
<td>10000</td>
</tr>
<tr>
<td>Fernandes</td>
<td>Timothy</td>
<td>timothy@fernandes.com</td>
<td>35</td>
<td>6500</td>
</tr>
<tr>
<td>Mendes</td>
<td>Danny</td>
<td>domnic@gmail.com</td>
<td>29</td>
<td>5500</td>
</tr>
<tr>
<td>Karpe</td>
<td>Sagar</td>
<td>sbharne@yahoo.com</td>
<td>25</td>
<td>4500</td>
</tr>
<tr>
<td>Stallone</td>
<td>Sylvester</td>
<td>sylvester@hotmail.com</td>
<td>60</td>
<td>10000</td>
</tr>
<tr>
<td>Fernandes</td>
<td>Domnic</td>
<td>timothy@fernandes.com</td>
<td>35</td>
<td>6500</td>
</tr>
</tbody>
</table>
<div id="pager" class="pager">
<form>
<img src="images/first.png" class="first"/>
<img src="images/prev.png" class="prev"/>
<input type="text" class="pagedisplay"/>
<img src="images/next.png" class="next"/>
<img src="images/last.png" class="last"/>
<select class="pagesize">
<option value="">LIMIT</option>
<option value="2">2 per page</option>
<option value="5">5 per page</option>
<option value="10">10 per page</option>
</select>
</form>
</div>
<script defer="defer">
$(document).ready(function()
{
$("#insured_list")
.tablesorter({widthFixed: true, widgets: ['zebra']})
.tablesorterPager({container: $("#pager")});
}
);
</script>
</body>
</html>