jQuery Plugin For Sortable And Orderable Table - VanderTable

File Size: 10 KB
Views Total: 4648
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Plugin For Sortable And Orderable Table - VanderTable

VanderTable is a jQuery table manipulation plugin which enables the users to sort table by clicking on headers (asc,desc), as well as re-ordering the table columns and rows via drag and drop (Requires jQuery UI).

How to use it:

1. Load the required jQuery and jQuery UI JavaScript libraries in the webpage.

<script src="/path/to/jquery.min.js"></script>
<script src="/path/to/jquery-ui.min.js"></script>

2. Load the jQuery VanderTable plugin's JS and CSS after jQuery.

<link rel="stylesheet" href="css/vandertable.css">
<script src="js/vandertable.js"></script>

3. Just call the function on your existing HTML table and done.

<table class="VanderTable">
</table>
$(".VanderTable").VanderTable();

4. Plugin's default options..

$(".VanderTable").VanderTable({

  // displays row number
  'showRowOrder': false,

  // allows table sort
  'allowTableSort': false,

  // disable re-order columns
  'disableColReordering': false,

  // disable re-order rows
  'disableRowReordering': false,

  // table color
  'color': '#167F92'

});

5. Callback functions that will be triggered when re-ordering table columns and rows through drag and drop.

$(".VanderTable").VanderTable({

  'onMoveCol': function() {},
  'onMoveRow': function() {}

});

This awesome jQuery plugin is developed by gustavozafra. For more Advanced Usages, please check the demo page or visit the official website.