Tablesorter demo

All options included, as well as the uitheme widget

by Mottie

HTML

<script src="http://mottie.github.com/tablesorter/js/jquery.tablesorter.js"></script>
<script src="http://mottie.github.com/tablesorter/js/jquery.tablesorter.widgets.js"></script>
<link rel="stylesheet" href="http://mottie.github.com/tablesorter/css/theme.blue.css">
<link rel="stylesheet" href="http://mottie.github.com/tablesorter/css/theme.dark.css">
<link rel="stylesheet" href="http://mottie.github.com/tablesorter/css/theme.default.css">
<link rel="stylesheet" href="http://mottie.github.com/tablesorter/css/theme.dropbox.css">
<link rel="stylesheet" href="http://mottie.github.com/tablesorter/css/theme.green.css">
<link rel="stylesheet" href="http://mottie.github.com/tablesorter/css/theme.grey.css">
<link rel="stylesheet" href="http://mottie.github.com/tablesorter/css/theme.ice.css">
<link rel="stylesheet" href="http://mottie.github.com/tablesorter/css/theme.black-ice.css">
<link rel="stylesheet" href="http://mottie.github.com/tablesorter/css/theme.bootstrap.css">
<link rel="stylesheet" href="http://mottie.github.com/tablesorter/addons/pager/jquery.tablesorter.pager.css">
<script src="http://mottie.github.com/tablesorter/addons/pager/jquery.tablesorter.pager.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.2/themes/ui-lightness/jquery-ui.css">
<link rel="stylesheet" href="http://mottie.github.com/tablesorter/css/theme.jui.css">
<button id="page" type="button">Current page</button>
<!-- pager -->
<div class="pager">
    <img src="http://mottie.github.com/tablesorter/addons/pager/icons/first.png" class="first" />
    <img src="http://mottie.github.com/tablesorter/addons/pager/icons/prev.png" class="prev" /> <span class="pagedisplay"></span> 
    <!-- this can be any element, including an input -->
    <img src="http://mottie.github.com/tablesorter/addons/pager/icons/next.png" class="next" />
    <img src="http://mottie.github.com/tablesorter/addons/pager/icons/last.png" class="last" />
    <select class="pagesize" title="Select page size">
...

JavaScript

/* Documentation for this tablesorter FORK can be found at
* http://mottie.github.io/tablesorter/docs/
*/
$(function () {
	$('table').tablesorter({
		theme: 'blue',
		widgets: ['zebra']
	}).tablesorterPager({
		// target the pager markup - see the HTML block below
		container: $('.pager')
	});

    $('#page').click(function(){
        var page = $('table')[0].config.pager.page; // zero-based index
        // or $('.gotoPage').val(); // one-based index
        alert( 'current page is ' + (page + 1) );
    });
});