Super Lightweight jQuery Table Sort Plugin - sortColumn
| File Size: | 5.23 KB |
|---|---|
| Views Total: | 1580 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
sortColumn is a tiny yet useful jQuery plugin which allows you to sort a particular column in a table by clicking on the column header.
Data format supported:
- String
- Number
- Currency
- Date (dd/mm/yyyy)
How to use it:
1. Import jQuery library and the jQuery sortColumn plugin at the end of the web page.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script type="text/javascript" src='jQuery_sortColumn.js'></script>
2. Create a data table.
<table id="table-demo">
<thead>
<tr>
<th id="column-header">Name</th>
</tr>
</thead>
<tbody>
<tr>
<td>Adam</td>
</tr>
<tr>
<td>Jonh</td>
</tr>
<tr>
<td>Peter</td>
</tr>
<tr>
<td>Sam</td>
</tr>
<tr>
<td>Zack</td>
</tr>
</tbody>
</table>
3. Enable the plugin with options.
var sortOrder1='asc';
jQuery('#column-header').click(function(){
if (sortOrder1=='asc'){
jQuery("#table-demo").sortColumn({
index: 1, // index is 1 based instead of 0 based because of css nth:child(index)
order: 'desc', // asc or desc
format: 'string' // string, number, currency or date format
});
sortOrder1='desc';
} else {
jQuery("#table-demo").sortColumn({
index: 1,
order: 'asc',
format: 'string'
});
sortOrder1='asc';
}
});
This awesome jQuery plugin is developed by bighoho123. For more Advanced Usages, please check the demo page or visit the official website.










