jQuery Sortable and Moveable Table Plugin - Table Sort

Table Sort is a tiny and easy-to-use jQuery table sort plugin that enables you to sort table columns by clicking the header. It also comes with a move function which allows you to move up/down table rows by clicking the up/down arrows.

How to use it:

1. Create a standard Html table. Using data-type attribute to define the data type for sorting.

2. Load the latest version of jQuery library and jQuery Table Sort at the bottom of your page.

<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="js/jquery.table_sort.min.js"></script>

3. Call the plugin.

<script>
<!--
$(function(){
  // Sortable
  $(".sort").tableSort();

  // Movable
  $(".sort").tableMove();
});
//-->
</script>

4. Advance usage.

<script>
$(function(){
  // Sortable
$(".sort").tableSort({
indexes: [0, 1, 3], // Target columns. Default is all.
compare: function(a, b){ // If you want to custom sort.
  a = a.replace("%", "") * 1;
  b = b.replace("%", "") * 1;
  return a - b;
},
after: function(th){ // The process to hook into sort after execution.
  console.log($(th).text() + " sorted!");
  // If use when combined with tableMove.
  // $(".sort").tableMove();
},
  });

  // Movable
$(".sort").tableMove({
after: function(tr){ // The process to hook into move after execution.
  console.log($(tr).find("td").eq(1).text() + " moved!");
},
  });
});
</script>

Change log:

2016-02-18

• update.

---

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