ThinkPHP5.1+Ajax无刷新分页

无刷新分页可以减轻服务器负担,利用Ajax技术,请求部分信息,提高网站访问速度,是网站建设的必备技术。

以二手车项目为例,需要在后台展示自定义属性列表(lst.html),其中的列表部分摘出来,放到(paginate1.html)中:

















{volist name="self" id="vo"}



{/volist}
ID 名称 取值 显示 排序 操作
{vo.name} {vo.isshow==1}

{else/}

{/if}
{">self|raw}








其中self是服务器端传递过来的自定义属性,并进行了分页操作:

this->assign("self",$selfattribute_select);

因为lst.html把列表摘了出来,所以还要在引入回去,才能使页面完整,同时,为了方便进行jquery操作,把列表用带id的div包裹起来:


{include file="selfattribute/paginate1"}

ThinkPHP5.1带的分页类使用的是BootStrap样式,它在页面显示时实际会有一个pagination的类,查看源代码如下:

这就是好多人搞不懂的pagination是怎么来的。

然后开始写js代码,因为我们的分页按钮也在被请求的页面当中,属于“未来”的元素,所以这里我们要用on方法,这个方法是jquery1.7以后的方法,注意自己的jquery版本。

其中.done()方法和success方法是一样的,return false是为了阻止默认事件,防止直接跳转。

那么服务器端就可以根据情况渲染模板了,代码如下:

public function lst()
{
this->assign("self",$selfattribute_select);
if (request()->isAjax()) {
return view("paginate1");
} else {
return view();
}
}
原文链接: http://www.xiaokethinkphp.com/archives/110

你可能感兴趣的:(ThinkPHP5.1+Ajax无刷新分页)