首先,我是个新手、、需要用AJAX分页,但是到处都找了没找到合适的,也就只能自己写了,网上看了下思路就开始动手。
下面是具体实现方式,请各位大侠指点
一、控制器中分配显示主页面
public function index(){
$this->assign('time',time()); //页面按需进行查询-分配等就行,不需要对分页数据进行查询
$this->display();
}
注:主页不需要对分页数据进行查询
二、在主页中创建一个DIV容器用于展示分页内容
1、HTML需求
{$time} //分页以外的数据,这些数据不会受分页的影响
<div id='ajaxpage'> //分页容器
<div class='page' st
yle='display:none;'><a href="{:U('ajaxPage',array('p'=>1))}" title="">自动点击执行AJAX请求显示第一页内容</a></div>
</div>
注:需要自己创建一个链接,指向分页控制器,并传入p=1;这个链接的作用是用jquery自动点击获取第一页数据;HTML的构造需要和分页的相同,这样jquery的AJAX请求才能正常获取a标签信息;如这里的构造是class=page里的a,与分页链接相同
2、JQuery需求
<script type="text/javascript">
//这是分页中各个分页的AJAX请求
$(function(){
$('#ajaxpage').on('click','.page a',function () {
$.ajax({
type: "GET",
url:$(this).attr('href'), //取得分页a标签链接地址,正好是要提交的控制器和传参:Index/ajaxPage/p/1
success:function(data){
$('#ajaxpage').html(data); //将分页控制器输出的模版加载到容器中
}
});
return false; //使a标签失效,防止页面跳转
});
});
注:必须用on进行动态绑定;接收返回的数据直接使用html()加载进模版指定的位置,不用对数据进行HTML格式组合
//需要先使用trigger当页面加载完自动点击一次创建的链接,完成首页数据的AJAX请求
$(function () {
$('.page a').trigger('click');
});
注:需要写在AJAX请求代码的下面;模拟点击的时候,就会请求上面的AJAX了
</script>
三、控制器中分页查询
public function ajaxPage(){
$question = M("question");
import('ORG.Util.Page');
$count = $question->where('question_category = 49 AND status = 0')->count(); //查询出总条数
$page=new Page($count,10);
$Page->rollPage = 10;
$page->setConfig('header','条记录');
$page->setConfig('prev','上一页');
$page->setConfig('next','下一页');
$page->setConfig('first','首页');
$page->setConfig('last','尾页');
$page->setConfig('theme',"<b>共%totalRow%%header% %nowPage%/%totalPage% 页 %first% %prePage% %upPage% %linkPage% %downPage% %nextPage% %end%</b>");
$limit=$page->firstRow.','.$page->listRows;
$list = $question->field('question_price,question_id,question_startTime,question_name,question_title,pay')->where('question_category = 49 AND status = 0')->order('question_startTime DESC')->limit($limit)->select();
$this->list=$list;
$this->assign('page',$page->show());
$this->display(); //这里直接使用display()而不是ajaxReturn()
}
注:这里就只对分页内容进行查询,并使用display()输出模版,而不是ajaxReturn()返回数据
四、分页内容显示
<foreach name='list' item='v'>
<tr>
<td>{$v['question_price']}</td>
<td>{$v['pay']}</td>
<td>{$v['question_title']}</td>
<td>{$v['question_name']}</td>
<td>{$v['question_startTime']|date='Y-m-d H:i:s',###}</td>
<td><a href="{:U('uptStatus',array('oldSta'=>'0','status'=>'1','id'=>$v['question_id']))}">退回</a>/<a href="{:U('uptStatus',array('oldSta'=>'0','status'=>'2','id'=>$v['question_id']))}">通过</a>/<a href="{:U('uptStatus',array('oldSta'=>'0','status'=>'8','id'=>$v['question_id']))}" onclick='return confirm("你确定删除吗?")'>回收站</a></td>
</tr>
</foreach>
<tr>
<td colspan="6" class='page'> //这里的class=page和首次点击的结构相同
{$page}
</td>
</tr>
注:这里的HTML只要分页的标签即可,不能有<html><body>这些标签
结语:这样的好处是将分页内容以模版形式构建,而不需要在AJAX请求的回调函数中构建,JS里写HTML各种蛋疼啊~因为是模拟点击获取的分页内容,所以在第一次页面加载完成时分页内容的显示会稍有延迟;当然,也可以在首页中就将分页第一页查询出来分配给模版并显示,但这样代码就会重复很多;也可以在后台将分页查询进行封装,前台使用<include>包含分页模版,这就看个人需求了