Tablesorter demo

All options included, as well as the uitheme widget

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/addons/pager/jquery.tablesorter.pager.css">
<script src="http://mottie.github.com/tablesorter/addons/pager/jquery.tablesorter.pager.js"></script>
<!-- pager -->
<div class="table-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">
        <option selected="selected" value="10">10</option>
        <option value="20">20</option>
        <option value="30">30</option>
        <option value="40">40</option>
    </select>
    <select class="gotoPage" title="Select page number"></select>
</div>
<table id="table">
    <thead>
        <tr>
            <th>Date</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>08.06.2015 10:36:53</td>
        </tr>
        <tr>
            <td>05.07.2015 10:48:23</td>
        </tr>
        <tr>
            <td>05.06.2015 10:34:35</td>
        </tr>
        <tr>
            <td>05.06.2015 10:34:05</td>
        </tr>
        <tr>
            <td>05.06.2015 10:33:42</td>
        </tr>
    </tbody>
</table>
<!-- pager -->
<div class="table-pager">
    <img src="http://mottie.github.com/tablesorter/addons/pager/icons/first.png" class="first" />
    <img...

JavaScript

/* Documentation for this tablesorter FORK can be found at
 * http://mottie.github.io/tablesorter/docs/
 */
$(function () {
    $('#table').tablesorter({
        sortList: [[1, 1]], // sorting(desc) by column with index 1
        dateFormat: 'ddmmyyyy',
        theme: 'blue',
        widthFixed: true,
        headerTemplate: '{content} {icon}',
        widgets: ['zebra', 'filter'],
        widgetOptions: {
            zebra: ["even", "odd"],
            // filter_anyMatch replaced! Instead use the filter_external option
            // Set to use a jQuery selector (or jQuery object) pointing to the
            // external filter (column specific or any match)
            filter_external: '.search',
            // add a default type search to the first name column
            filter_defaultFilter: {
                1: '~{query}'
            },
            // include column filters
            filter_columnFilters: true,
            filter_placeholder: {
                search: 'Искать...'
            },
            filter_saveFilters: true,
            filter_reset: '.reset'
        }
    }).tablesorterPager({
        container: $(".table-pager"),
        output: '{page} из {filteredPages} ({filteredRows})',
        size: 5
    });
});