对表数据应用分页 [英] Apply pagination on table data
本文介绍了对表数据应用分页的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我为数据表和分页功能编写代码，它适用于特定页面。现在我想让这个代码在多个页面上共同使用。
但是无法做到。 PLZ建议我在我的代码中需要更改。我的代码如下：
Hi, I write code for data table and pagination feature, it is working for a particular page. Now I want to make this code for common to multiple page.
But not able to do. plz suggest me the require change in my code. my code is as follow:
<script type="text/javascript" charset="utf-8">
$.fn.dataTableExt.oPagination.iTweenTime = 100;
$.fn.dataTableExt.oPagination.scrolling = {
"fnInit": function ( oSettings, fnCallbackDraw )
{
var nPaging = oSettings.anFeatures.p;
/* Store the next and previous elements in the oSettings object as they can be very
* usful for automation - particularly testing
*/
oSettings.nPrevious = document.createElement( 'div' );
oSettings.nNext = document.createElement( 'div' );
if ( oSettings.sTableId !== '' )
{
nPaging.setAttribute( 'id', oSettings.sTableId+'_paginate' );
oSettings.nPrevious.setAttribute( 'id', oSettings.sTableId+'_previous' );
oSettings.nNext.setAttribute( 'id', oSettings.sTableId+'_next' );
}
oSettings.nPrevious.className = "paginate_disabled_previous";
oSettings.nNext.className = "paginate_disabled_next";
oSettings.nPrevious.title = oSettings.oLanguage.oPaginate.sPrevious;
oSettings.nNext.title = oSettings.oLanguage.oPaginate.sNext;
nPaging.appendChild( oSettings.nPrevious );
nPaging.appendChild( oSettings.nNext );
$(nPaging).insertAfter( oSettings.nTable );
$(oSettings.nPrevious).click( function() {
/* Disallow paging event during a current paging event */
if ( typeof oSettings.iPagingLoopStart != 'undefined' && oSettings.iPagingLoopStart != -1 )
{
return;
}
oSettings.iPagingLoopStart = oSettings._iDisplayStart;
oSettings.iPagingEnd = oSettings._iDisplayStart - oSettings._iDisplayLength;
/* Correct for underrun */
if ( oSettings.iPagingEnd < 0 )
{
oSettings.iPagingEnd = 0;
}
var iTween = $.fn.dataTableExt.oPagination.iTweenTime;
var innerLoop = function () {
if ( oSettings.iPagingLoopStart > oSettings.iPagingEnd ) {
oSettings.iPagingLoopStart--;
oSettings._iDisplayStart = oSettings.iPagingLoopStart;
fnCallbackDraw( oSettings );
setTimeout( function() { innerLoop(); }, iTween );
} else {
oSettings.iPagingLoopStart = -1;
}
};
innerLoop();
} );
$(oSettings.nNext).click( function() {
/* Disallow paging event during a current paging event */
if ( typeof oSettings.iPagingLoopStart != 'undefined' && oSettings.iPagingLoopStart != -1 )
{
return;
}
oSettings.iPagingLoopStart = oSettings._iDisplayStart;
/* Make sure we are not over running the display array */
if ( oSettings._iDisplayStart + oSettings._iDisplayLength < oSettings.fnRecordsDisplay() )
{
oSettings.iPagingEnd = oSettings._iDisplayStart + oSettings._iDisplayLength;
}
var iTween = $.fn.dataTableExt.oPagination.iTweenTime;
var innerLoop = function () {
if ( oSettings.iPagingLoopStart < oSettings.iPagingEnd ) {
oSettings.iPagingLoopStart++;
oSettings._iDisplayStart = oSettings.iPagingLoopStart;
fnCallbackDraw( oSettings );
setTimeout( function() { innerLoop(); }, iTween );
} else {
oSettings.iPagingLoopStart = -1;
}
};
innerLoop();
} );
/* Take the brutal approach to cancelling text selection */
$(oSettings.nPrevious).bind( 'selectstart', function () { return false; } );
$(oSettings.nNext).bind( 'selectstart', function () { return false; } );
},
"fnUpdate": function ( oSettings, fnCallbackDraw )
{
if ( !oSettings.anFeatures.p )
{
return;
}
oSettings.nPrevious.className =
( oSettings._iDisplayStart === 0 ) ?
"paginate_disabled_previous" : "paginate_enabled_previous";
oSettings.nNext.className =
( oSettings.fnDisplayEnd() == oSettings.fnRecordsDisplay() ) ?
"paginate_disabled_next" : "paginate_enabled_next";
}
}
jQuery.fn.dataTableExt.aTypes.push(
function ( sData )
{
var sValidChars = "0123456789-,";
var Char;
var bDecimal = false;
/* Check the numeric part */
for ( i=0 ; i<sData.length ; i++ )
{
Char = sData.charAt(i);
if (sValidChars.indexOf(Char) == -1)
{
return null;
}
/* Only allowed one decimal place... */
if ( Char == "," )
{
if ( bDecimal )
{
return null;
}
bDecimal = true;
}
}
return 'numeric-comma';
}
);
jQuery.fn.dataTableExt.oSort['numeric-comma-asc'] = function(a,b) {
var x = (a == "-") ? 0 : a.replace( /,/, "." );
var y = (b == "-") ? 0 : b.replace( /,/, "." );
x = parseFloat( x );
y = parseFloat( y );
return ((x < y) ? -1 : ((x > y) ? 1 : 0));
};
jQuery.fn.dataTableExt.oSort['numeric-comma-desc'] = function(a,b) {
var x = (a == "-") ? 0 : a.replace( /,/, "." );
var y = (b == "-") ? 0 : b.replace( /,/, "." );
x = parseFloat( x );
y = parseFloat( y );
return ((x < y) ? 1 : ((x > y) ? -1 : 0));
};
$(document).ready(function() {
$('#preactivitymanagementtable').dataTable( {
"sPaginationType": "scrolling",
"bAutoWidth": false,
} );
} );
</script>
推荐答案
.fn.dataTableExt.oPagination.iTweenTime = 100 ;
.fn.dataTableExt.oPagination.iTweenTime = 100;
.fn.dataTableExt.oPagination.scrolling = {
fnInit：function（oSettings，fnCallbackDraw）
{
var nPaging = oSettings.anFeatures.p;
/ * 将下一个和前一个元素存储在oSettings对象中，因为它们可以非常
*用于自动化 - 特别是测试
* /
oSettings.nPrevious = document.createElement（' div'）;
oSettings.nNext = document.createElement（' div'）;
if （oSettings.sTableId！== ' '）
{
nPaging.setAttribute（' id '，oSettings.sTableId + ' _ paginate'）;
oSettings.nPrevious.setAttribute（' id'，oSettings.sTableId + ' _ previous'）;
oSettings.nNext.setAttribute（' id'，oSettings.sTableId + ' _ next'）;
}
oSettings.nPrevious.className = paginate_disabled_previous ;
oSettings.nNext.className = paginate_disabled_next;
oSettings.nPrevious.title = oSettings.oLanguage.oPaginate.sPrevious;
oSettings.nNext.title = oSettings.oLanguage.oPaginate.sNext;
nPaging.appendChild（oSettings.nPrevious）;
nPaging.appendChild（oSettings.nNext）;
.fn.dataTableExt.oPagination.scrolling = { "fnInit": function ( oSettings, fnCallbackDraw ) { var nPaging = oSettings.anFeatures.p; /* Store the next and previous elements in the oSettings object as they can be very * usful for automation - particularly testing */ oSettings.nPrevious = document.createElement( 'div' ); oSettings.nNext = document.createElement( 'div' ); if ( oSettings.sTableId !== '' ) { nPaging.setAttribute( 'id', oSettings.sTableId+'_paginate' ); oSettings.nPrevious.setAttribute( 'id', oSettings.sTableId+'_previous' ); oSettings.nNext.setAttribute( 'id', oSettings.sTableId+'_next' ); } oSettings.nPrevious.className = "paginate_disabled_previous"; oSettings.nNext.className = "paginate_disabled_next"; oSettings.nPrevious.title = oSettings.oLanguage.oPaginate.sPrevious; oSettings.nNext.title = oSettings.oLanguage.oPaginate.sNext; nPaging.appendChild( oSettings.nPrevious ); nPaging.appendChild( oSettings.nNext );
（nPaging）.insertAfter（oSettings.nTable）;
(nPaging).insertAfter( oSettings.nTable );
这篇关于对表数据应用分页的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
