dataTables.conditionalPaging
HTML
<script src="//cdn.datatables.net/plug-ins/1.10.6/integration/jqueryui/dataTables.jqueryui.min.js"></script>
<link rel="stylesheet" href="//cdn.datatables.net/plug-ins/1.10.6/integration/jqueryui/dataTables.jqueryui.css">
<script src="//cdn.datatables.net/1.10.6/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<link rel="stylesheet" href="code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<div class="container">
<table id="example" class="display" cellspacing="0" width="100%"></table>
</div>
JavaScript
$(document).ready(function () {
$(document).on('init.dt', function (e, dtSettings) {
if (e.namespace !== 'dt') {
return;
}
var options = dtSettings.oInit.conditionalPaging;
if ($.isPlainObject(options) || options === true) {
var config = $.isPlainObject(options) ? options : {},
api = new $.fn.dataTable.Api(dtSettings),
speed = 'slow',
conditionalPaging = function (e) {
var $paging = $(api.table().container()).find('div.dataTables_paginate'),
pages = api.page.info().pages;
if ($.isPlainObject(e)) {
if (pages <= 1) {
if (config.style === 'fade') {
$paging.stop().fadeTo(speed, 0);
} else {
$paging.css('visibility', 'hidden');
}
} else {
if (config.style === 'fade') {
$paging.stop().fadeTo(speed, 1);
} else {
$paging.css('visibility', '');
}
}
} else if (pages <= 1) {
if (config.style === 'fade') {
$paging.css('opacity', 0);
} else {
$paging.css('visibility', 'hidden');
}
}
//my update
else if (pages > 1) {
if (config.style === 'fade') {
$paging.css('opacity', 1);
} else {
$paging.css('visibility', 'visible');
}
}
};
if ($.isNumeric(config.speed) ||...