Simplest Table Paging & Sorting Plugin For jQuery - Sortpaginate.js

Simplest Table Paging & Sorting Plugin For jQuery - Sortpaginate.js
File Size: 11.9 KB
Views Total:
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

Sortpaginate.js is a lightweight and simple-to-use jQuery plugin which adds pagination and sorting capabilities to your existing html table.

Basic usage:

1. Download and include the jQuery sortpaginate.js plugin after you have jQuery library installed.

<script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
<script src="scripts/jQuery.sortpaginate.js"></script>

2. Call the function sortpaginate() on the html table and we're ready to go.

$("table").sortpaginate();

3. Style the plugin and add sorting signals to your table's header.

.sp_wrapper .sp_table table { table-layout: fixed; }

.sp_wrapper .sp_table thead th {
  cursor: pointer;
  background-color: #fff;
}

.sp_wrapper .sp_table .sp_sorted_asc {
  background-image: url("down-arrow.png");
  background-position: right center;
  background-repeat: no-repeat;
}

.sp_wrapper .sp_table .sp_sorted_desc {
  background-image: url("up-arrow.png");
  background-position: right center;
  background-repeat: no-repeat;
}

.sp_wrapper .sp_navigator .sp_next, .sp_wrapper .sp_navigator .sp_previous {
  margin-left: 5px;
  margin-right: 5px;
}

5. Change the pageSize value for table pagination.

$("table").sortpaginate({pageSize: 5});

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