jQuery Plugin For Sortable Bootstrap Tables - Bootstrap Sortable
File Size: | 30 KB |
---|---|
Views Total: | 24716 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
Bootstrap Sortable is a jQuery extension for Bootstrap that adds the capability of sorting rows of your Bootstrap tables by your own rules.
Features:
- Allows to disable sorting for a specific table column.
- Sorts table data alphabetically.
- Sorts table data by numbers.
- Sorts table data by dates. (Requires Momont.js).
- Custom sorting signs.
Basic usage:
1. Add the Bootstrap Sortable plugin's JavaScript and CSS into your Bootstrap project.
<link href="bootstrap-sortable.css" rel="stylesheet" type="text/css"> <script src="//code.jquery.com/jquery-1.11.3.min.js"></script> <script src="bootstrap-sortable.js"></script>
2. Add the CSS class sortable to your existing table and done.
<table class="table sortable"> ... </table>
3. Use the data-defaultsort='disabled'
attribute to disable sorting on specific table columns.
<table class="table sortable"> <th data-defaultsort="disabled"></th> ... </table>
4. Customize the sorting signs using the data-defaultsign
attribute. Available values: 'az', 'AZ', '_19', 'month'.
<table class="table sortable"> <th data-defaultsign="AZ">First Name</th> ... </table>
5. More Html data
attributes.
data-dateformat
: Specify the date format used for sorting by dates. Requies Momont.js.data-value
: Specify the data value to be sorted.data-firstsort="desc"
: change the initial direction.
Change log:
2017-03-27
- sorting table with rowspan cells
2016-10-21
- handling of tables inside tables
This awesome jQuery plugin is developed by drvic10k. For more Advanced Usages, please check the demo page or visit the official website.