221 lines
6.8 KiB
JavaScript
Executable File
221 lines
6.8 KiB
JavaScript
Executable File
/**
|
|
* Sometimes for quick navigation, it can be useful to allow an end user to
|
|
* enter which page they wish to jump to manually. This paging control uses a
|
|
* text input box to accept new paging numbers (arrow keys are also allowed
|
|
* for), and four standard navigation buttons are also presented to the end
|
|
* user.
|
|
*
|
|
* @name Navigation with text input
|
|
* @summary Shows an input element into which the user can type a page number
|
|
* @author [Allan Jardine](http://sprymedia.co.uk)
|
|
*
|
|
* @example
|
|
* $(document).ready(function() {
|
|
* $('#example').dataTable( {
|
|
* "sPaginationType": "input"
|
|
* } );
|
|
* } );
|
|
*/
|
|
|
|
$.fn.dataTableExt.oPagination.input = {
|
|
"fnInit": function ( oSettings, nPaging, fnCallbackDraw )
|
|
{
|
|
var nFirst = document.createElement( 'span' );
|
|
var nPrevious = document.createElement( 'span' );
|
|
var nNext = document.createElement( 'span' );
|
|
var nLast = document.createElement( 'span' );
|
|
var nInput = document.createElement( 'input' );
|
|
var nPage = document.createElement( 'span' );
|
|
var nOf = document.createElement( 'span' );
|
|
|
|
nFirst.innerHTML = oSettings.oLanguage.oPaginate.sFirst;
|
|
nPrevious.innerHTML = oSettings.oLanguage.oPaginate.sPrevious;
|
|
nNext.innerHTML = oSettings.oLanguage.oPaginate.sNext;
|
|
nLast.innerHTML = oSettings.oLanguage.oPaginate.sLast;
|
|
|
|
nFirst.className = "paginate_button first disabled";
|
|
nPrevious.className = "paginate_button previous disabled";
|
|
nNext.className="paginate_button next";
|
|
nLast.className = "paginate_button last";
|
|
nOf.className = "paginate_of";
|
|
nPage.className = "paginate_page";
|
|
nInput.className = "paginate_input";
|
|
|
|
if ( oSettings.sTableId !== '' )
|
|
{
|
|
nPaging.setAttribute( 'id', oSettings.sTableId+'_paginate' );
|
|
nPrevious.setAttribute( 'id', oSettings.sTableId+'_previous' );
|
|
nPrevious.setAttribute( 'id', oSettings.sTableId+'_previous' );
|
|
nNext.setAttribute( 'id', oSettings.sTableId+'_next' );
|
|
nLast.setAttribute( 'id', oSettings.sTableId+'_last' );
|
|
}
|
|
|
|
nInput.type = "text";
|
|
nPage.innerHTML = "Page ";
|
|
|
|
nPaging.appendChild( nFirst );
|
|
nPaging.appendChild( nPrevious );
|
|
nPaging.appendChild( nPage );
|
|
nPaging.appendChild( nInput );
|
|
nPaging.appendChild( nOf );
|
|
nPaging.appendChild( nNext );
|
|
nPaging.appendChild( nLast );
|
|
|
|
$(nFirst).click( function ()
|
|
{
|
|
var iCurrentPage = Math.ceil(oSettings._iDisplayStart / oSettings._iDisplayLength) + 1;
|
|
if (iCurrentPage != 1)
|
|
{
|
|
oSettings.oApi._fnPageChange( oSettings, "first" );
|
|
fnCallbackDraw( oSettings );
|
|
$(nFirst).addClass('disabled');
|
|
$(nPrevious).addClass('disabled');
|
|
$(nNext).removeClass('disabled');
|
|
$(nLast).removeClass('disabled');
|
|
}
|
|
} );
|
|
|
|
$(nPrevious).click( function()
|
|
{
|
|
var iCurrentPage = Math.ceil(oSettings._iDisplayStart / oSettings._iDisplayLength) + 1;
|
|
if (iCurrentPage != 1)
|
|
{
|
|
oSettings.oApi._fnPageChange(oSettings, "previous");
|
|
fnCallbackDraw(oSettings);
|
|
if (iCurrentPage == 2)
|
|
{
|
|
$(nFirst).addClass('disabled');
|
|
$(nPrevious).addClass('disabled');
|
|
}
|
|
$(nNext).removeClass('disabled');
|
|
$(nLast).removeClass('disabled');
|
|
}
|
|
} );
|
|
|
|
$(nNext).click( function()
|
|
{
|
|
var iCurrentPage = Math.ceil(oSettings._iDisplayStart / oSettings._iDisplayLength) + 1;
|
|
if (iCurrentPage != Math.ceil((oSettings.fnRecordsDisplay() / oSettings._iDisplayLength)))
|
|
{
|
|
oSettings.oApi._fnPageChange(oSettings, "next");
|
|
fnCallbackDraw(oSettings);
|
|
if (iCurrentPage == (Math.ceil((oSettings.fnRecordsDisplay() - 1) / oSettings._iDisplayLength) - 1))
|
|
{
|
|
$(nNext).addClass('disabled');
|
|
$(nLast).addClass('disabled');
|
|
}
|
|
$(nFirst).removeClass('disabled');
|
|
$(nPrevious).removeClass('disabled');
|
|
}
|
|
} );
|
|
|
|
$(nLast).click( function()
|
|
{
|
|
var iCurrentPage = Math.ceil(oSettings._iDisplayStart / oSettings._iDisplayLength) + 1;
|
|
if (iCurrentPage != Math.ceil((oSettings.fnRecordsDisplay() / oSettings._iDisplayLength)))
|
|
{
|
|
oSettings.oApi._fnPageChange(oSettings, "last");
|
|
fnCallbackDraw(oSettings);
|
|
$(nFirst).removeClass('disabled');
|
|
$(nPrevious).removeClass('disabled');
|
|
$(nNext).addClass('disabled');
|
|
$(nLast).addClass('disabled');
|
|
}
|
|
} );
|
|
|
|
$(nInput).keyup( function (e) {
|
|
// 38 = up arrow, 39 = right arrow
|
|
if ( e.which == 38 || e.which == 39 )
|
|
{
|
|
this.value++;
|
|
}
|
|
// 37 = left arrow, 40 = down arrow
|
|
else if ( (e.which == 37 || e.which == 40) && this.value > 1 )
|
|
{
|
|
this.value--;
|
|
}
|
|
|
|
if ( this.value === "" || this.value.match(/[^0-9]/) )
|
|
{
|
|
/* Nothing entered or non-numeric character */
|
|
this.value = this.value.replace(/[^\d]/g, ''); // don't even allow anything but digits
|
|
return;
|
|
}
|
|
|
|
var iNewStart = oSettings._iDisplayLength * (this.value - 1);
|
|
if (iNewStart < 0)
|
|
{
|
|
iNewStart = 0;
|
|
}
|
|
if (iNewStart > oSettings.fnRecordsDisplay())
|
|
{
|
|
iNewStart = (Math.ceil((oSettings.fnRecordsDisplay() - 1) / oSettings._iDisplayLength) - 1) * oSettings._iDisplayLength;
|
|
}
|
|
|
|
if (iNewStart === 0)
|
|
{
|
|
$(nFirst).addClass('disabled');
|
|
$(nPrevious).addClass('disabled');
|
|
$(nNext).removeClass('disabled');
|
|
$(nLast).removeClass('disabled');
|
|
}
|
|
else if (iNewStart == ((Math.ceil((oSettings.fnRecordsDisplay() - 1) / oSettings._iDisplayLength) - 1) * oSettings._iDisplayLength))
|
|
{
|
|
$(nNext).addClass('disabled');
|
|
$(nLast).addClass('disabled');
|
|
$(nFirst).removeClass('disabled');
|
|
$(nPrevious).removeClass('disabled');
|
|
}
|
|
else
|
|
{
|
|
$(nFirst).removeClass('disabled');
|
|
$(nPrevious).removeClass('disabled');
|
|
$(nNext).removeClass('disabled');
|
|
$(nLast).removeClass('disabled');
|
|
}
|
|
|
|
oSettings._iDisplayStart = iNewStart;
|
|
fnCallbackDraw( oSettings );
|
|
} );
|
|
|
|
/* Take the brutal approach to cancelling text selection */
|
|
$('span', nPaging).bind( 'mousedown', function () { return false; } );
|
|
$('span', nPaging).bind( 'selectstart', function () { return false; } );
|
|
|
|
// If we can't page anyway, might as well not show it
|
|
var iPages = Math.ceil((oSettings.fnRecordsDisplay()) / oSettings._iDisplayLength);
|
|
if(iPages <= 1)
|
|
{
|
|
$(nPaging).hide();
|
|
}
|
|
},
|
|
|
|
|
|
"fnUpdate": function ( oSettings, fnCallbackDraw )
|
|
{
|
|
if ( !oSettings.aanFeatures.p )
|
|
{
|
|
return;
|
|
}
|
|
var iPages = Math.ceil((oSettings.fnRecordsDisplay()) / oSettings._iDisplayLength);
|
|
var iCurrentPage = Math.ceil(oSettings._iDisplayStart / oSettings._iDisplayLength) + 1;
|
|
|
|
var an = oSettings.aanFeatures.p;
|
|
if (iPages <= 1) // hide paging when we can't page
|
|
{
|
|
$(an).hide();
|
|
}
|
|
else
|
|
{
|
|
/* Loop over each instance of the pager */
|
|
for (var i = 0, iLen = an.length ; i < iLen ; i++)
|
|
{
|
|
var spans = an[i].getElementsByTagName('span');
|
|
var inputs = an[i].getElementsByTagName('input');
|
|
spans[3].innerHTML = " of " + iPages;
|
|
inputs[0].value = iCurrentPage;
|
|
}
|
|
}
|
|
}
|
|
};
|