共被编辑 3 次
jQuery dataTable 服务器端分页如何实现
想知道的问题：1.如何在不改变服务器端传回的 分页页码(page)、 分页每页显示记录数(rows)、总页数(totalPage)、全部记录数(totalRecords)、这些参数名称的情况下让表格左下角显示我这些分页的信息
2.如何让右下角下一页上一页按钮点击的时候调用后台方法获取分页信息显示在表格里，如下图：
jQuery dataTable 服务器端分页如何实现
想知道的问题：
1.如何在不改变服务器端传回的 分页页码(page)、 分页每页显示记录数(rows)、总页数(totalPage)、全部记录数(totalRecords)、这些参数名称的情况下让表格左下角显示我这些分页的信息
2.如何让右下角下一页上一页按钮点击的时候调用后台方法获取分页信息显示在表格里，如下图：
jQuery dataTable 服务器端分页如何实现
想知道的问题：1.如何在不改变服务器端传回的 分页页码(page)、 分页每页显示记录数(rows)、总页数(totalPage)、全部记录数(totalRecords)、这些参数名称的情况下让表格左下角显示我这些分页的信息2.如何让右下角下一页上一页按钮点击的时候调用后台方法获取分页信息显示在表格里，如下图：
我要该，理由是：有时候我们从数据库获取的数据量太大，而我们不需要一次性显示那么多的时候，我们就要对数据进行分页处理了，让每页显示不同的数据。
public DataTable GetPagedTable(DataTable dt, int PageIndex, int PageSize)//PageIndex表示第几页，PageSize表示每页的记录数
if (PageIndex == 0)
return//0页代表每页数据，直接返回
DataTable newdt = dt.Copy();
newdt.Clear();//copy dt的框架
int rowbegin = (PageIndex - 1) * PageS
int rowend = PageIndex * PageS
if (rowbegin &= dt.Rows.Count)
return//源数据记录数小于等于要显示的记录，直接返回dt
if (rowend & dt.Rows.Count)
rowend = dt.Rows.C
for (int i = i &= rowend - 1; i++)
DataRow newdr = newdt.NewRow();
DataRow dr = dt.Rows[i];
foreach (DataColumn column in dt.Columns)
newdr[column.ColumnName] = dr[column.ColumnName];
newdt.Rows.Add(newdr);
作者：Adolf Ye出处：本文版权归作者和博客园共有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文连接，否则保留追究法律责任的权利。
Views(...) Comments()没有更多推荐了，
不良信息举报
举报内容：
实现jquery DataTable前后台动态分页
举报原因：
原文地址：
原因补充：
最多只允许输入30个字
加入CSDN，享受更精准的内容推荐，与500万程序员共同成长！jquery DataTable实现前后台动态分页
当前位置： >
> jquery DataTable实现前后台动态分页jquery DataTable实现前后台动态分页更新：&&&&编辑：小雪崩&&&&来源：哥乖整理&&&&人气：加载中...&&&&字号：|标签：&&&&&&&&&&&&
整理文档，搜刮出一个 前，稍微整理精简一下做下。
&!DOCTYPE html&
&meta charset="utf-8"&
&meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"&
&title&页面&/title&
&meta content=""&
&meta content=""&
&link href="https://cdn.datatables.net/1.10.12/css/.dataTables.min.css"&
&link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.2/css/bootstrap.css"&
&link href="https://cdn.datatables.net/1.10.12/css/dataTables.bootstrap4.min.css"&
&table cellspacing="0"&
&th&Name&/th&
&th&Cellphone&/th&
&th&Position&/th&
&th&Company&/th&
&th&Salary&/th&
&script type="text/javascript" src="//code.jquery.com/jquery-1.12.3.min.js"&&/script&
&script type="text/javascript" src=" //cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"&&/script&
&script type="text/javascript"&
$(document).ready(function() {
refresh();
var refreshDataTable=function() {
var table = $('#example').DataTable({
//"ajax":"data/tabledata.json",
// "iDisplayLength": 3,
"sPaginationType": "full_numbers",
"bPaginite": true,
"bInfo": true,
"bSort": true,
"processing": false,
"serverSide": true,
"sAjaxSource": "customize/datatable.php",//这个是请求的地址
"fnServerData": retrieveData
function retrieveData(url, aoData, fnCallback) {
var data={"data":{"id":"123123","name":"2s",}};
url: url,//这个就是请求地址对应sAjaxSource
"aoData" : JSON.stringify(aoData)
type: 'POST',
dataType: 'json',
async: false,
success: function (result) {
//var obj=JSON.parse(result);
console.log(result);
fnCallback(result);//把返回的数据传给这个法子就可以了,datatable会自动绑定数据的
error:function(XMLHttpRequest, textStatus, errorThrown) {
alert("status:"+XMLHttpRequest.status+",readyState:"+XMLHttpRequest.readyState+",textStatus:"+textStatus);
header('Content-type: text/json');
$res = $_POST['aoData'];
$sEcho = 0;
$iDisplayStart = 0; // 起始索引
$iDisplayLength = 0;//长度
$jsonarray= json_decode($res) ;
foreach($jsonarray as $value){
if($value-&name=="sEcho"){
$sEcho=$value-&
if($value-&name=="iDisplayStart"){
$iDisplayStart=$value-&
if($value-&name=="iDisplayLength"){
$iDisplayLength=$value-&
$Array = Array();
//此处生成50条数据，，模仿数据库数据
for ($i = 1; $i & 51; $i++) {
$d = array($i,$i,$i,$i,$i);
Array_push($Array, $d);
$json_data = array ('sEcho'=&$sEcho,'iTotalRecords'=&50,'iTotalDisplayRecords'=&50,'aaData'=&array_slice($Array,$iDisplayStart,$iDisplayLength)); //遵照datatable的当前页和每页长度返回json数据
$obj=json_encode($json_data);
评论列表（网友评论仅供网友表达个人看法，并不表明本站同意其观点或证实其描述）
分类选择您可能在找这些帮设计师节省1,085,543,232小时温馨提示！由于新浪微博认证机制调整，您的新浪微博帐号绑定已过期，请重新绑定！&&|&&
动静皆宜,性格慢热！玩起来可以很疯狂。
LOFTER精选
网易考拉推荐
用微信&&“扫一扫”
将文章分享到朋友圈。
用易信&&“扫一扫”
将文章分享到朋友圈。
阅读(955)|
用微信&&“扫一扫”
将文章分享到朋友圈。
用易信&&“扫一扫”
将文章分享到朋友圈。
历史上的今天
loftPermalink:'',
id:'fks_',
blogTitle:'为DataTable自建RowNumber，实现分页',
blogAbstract:'有些时候，我们已经把数据从数据库中取了出来，刚好前台也要求分页显示数据。这个时候要好好利用DataTable了，避免重复访问数据库，降低了性能。回想从SqlServer2005开始，里面有个Row_Number()的函数，用来计算数据行号的。对分页有大大的帮助，换个思维，我们倘若为DataTable的每一行增加一个行号，则可以大大方便分页操作。创建一个为DataTable写入行号的扩展方法：public static class AddRowNumber
/// &summary&
/// 为DataTable增加RowNumber
/// &/summary&
/// &param name=\"ds\"&&/param&',
blogTag:'datatable行号,datatable的rownumber,access分页,linq分页',
blogUrl:'blog/static/',
isPublished:1,
istop:false,
modifyTime:5,
publishTime:3,
permalink:'blog/static/',
commentCount:0,
mainCommentCount:0,
recommendCount:0,
bsrk:-100,
publisherId:0,
recomBlogHome:false,
currentRecomBlog:false,
attachmentsFileIds:[],
groupInfo:{},
friendstatus:'none',
followstatus:'unFollow',
pubSucc:'',
visitorProvince:'',
visitorCity:'',
visitorNewUser:false,
postAddInfo:{},
mset:'000',
remindgoodnightblog:false,
isBlackVisitor:false,
isShowYodaoAd:false,
hostIntro:'动静皆宜,性格慢热！玩起来可以很疯狂。',
hmcon:'0',
selfRecomBlogCount:'0',
lofter_single:''
{list a as x}
{if x.moveFrom=='wap'}
{elseif x.moveFrom=='iphone'}
{elseif x.moveFrom=='android'}
{elseif x.moveFrom=='mobile'}
${a.selfIntro|escape}{if great260}${suplement}{/if}
{list a as x}
推荐过这篇日志的人：
{list a as x}
{if !!b&&b.length>0}
他们还推荐了：
{list b as y}
转载记录：
{list d as x}
{list a as x}
{list a as x}
{list a as x}
{list a as x}
{if x_index>4}{break}{/if}
${fn2(x.publishTime,'yyyy-MM-dd HH:mm:ss')}
{list a as x}
{if !!(blogDetail.preBlogPermalink)}
{if !!(blogDetail.nextBlogPermalink)}
{list a as x}
{if defined('newslist')&&newslist.length>0}
{list newslist as x}
{if x_index>7}{break}{/if}
{list a as x}
{var first_option =}
{list x.voteDetailList as voteToOption}
{if voteToOption==1}
{if first_option==false},{/if}&&“${b[voteToOption_index]}”&&
{if (x.role!="-1") },“我是${c[x.role]}”&&{/if}
&&&&&&&&${fn1(x.voteTime)}
{if x.userName==''}{/if}
网易公司版权所有&&
{list x.l as y}
{if defined('wl')}
{list wl as x}{/list}