thinkphp上的ajax无刷新分页

1. <?php 
2. // +---------------------------------------------------------------------- 
3. // | ThinkPHP [ WE CAN DO IT JUST THINK IT ] 
4. // +---------------------------------------------------------------------- 
5. // | Copyright (c) 2009 http://thinkphp.cn All rights reserved. 
6. // +---------------------------------------------------------------------- 
7. // | Licensed ( http://www.apache.org/licenses/LICENSE-2.0 ) 
8. // +---------------------------------------------------------------------- 
9. // | Author: liu21st <liu21st@gmail.com> 
10. // +---------------------------------------------------------------------- 
11. // $Id: Page.class.php 2712 2012-02-06 10:12:49Z liu21st $ 
12. namespace Common\Common; 
13. class AjaxPage { 
14.     // 分页栏每页显示的页数 
15.     public $rollPage = 5; 
16.     // 页数跳转时要带的参数 
17.     public $parameter  ; 
18.     // 默认列表每页显示行数 
19.     public $listRows = 20; 
20.     // 起始行数 
21.     public $firstRow ; 
22.     // 分页总页面数 
23.     protected $totalPages  ; 
24.     // 总行数 
25.     protected $totalRows  ; 
26.     // 当前页数 
27.     protected $nowPage    ; 
28.     // 分页的栏的总页数 
29.     protected $coolPages   ; 
30.     // 分页显示定制 
31.     protected $config  = array('header'=>'条记录','prev'=>'上一页','next'=>'下一页','first'=>'第一页','last'=>'最后一页','theme'=>' %totalRow% %header% %nowPage%/%totalPage% 页 %upPage% %downPage% %first%  %prePage%  %linkPage%  %nextPage% %end%'); 
32.     // 默认分页变量名 
33.     protected $varPage; 
34.  
35.  
36.     public function __construct($totalRows,$listRows='',$ajax_func,$parameter='') { 
37.         $this->totalRows = $totalRows; 
38.         $this->ajax_func = $ajax_func; 
39.         $this->parameter = $parameter; 
40.         $this->varPage = C('VAR_PAGE') ? C('VAR_PAGE') : 'p' ; 
41.         if(!emptyempty($listRows)) { 
42.             $this->listRows = intval($listRows); 
43.         } 
44.         $this->totalPages = ceil($this->totalRows/$this->listRows);     //总页数 
45.         $this->coolPages  = ceil($this->totalPages/$this->rollPage); 
46.         $this->nowPage  = !emptyempty($_GET[$this->varPage])?intval($_GET[$this->varPage]):1; 
47.         if(!emptyempty($this->totalPages) && $this->nowPage>$this->totalPages) { 
48.             $this->nowPage = $this->totalPages; 
49.         } 
50.         $this->firstRow = $this->listRows*($this->nowPage-1); 
51.     } 
52.  
53.      public function nowpage($totalRows,$listRows='',$ajax_func,$parameter='') { 
54.         $this->totalRows = $totalRows; 
55.         $this->ajax_func = $ajax_func; 
56.         $this->parameter = $parameter; 
57.         $this->varPage = C('VAR_PAGE') ? C('VAR_PAGE') : 'p' ; 
58.         if(!emptyempty($listRows)) { 
59.             $this->listRows = intval($listRows); 
60.         } 
61.         $this->totalPages = ceil($this->totalRows/$this->listRows);     //总页数 
62.         $this->coolPages  = ceil($this->totalPages/$this->rollPage); 
63.         $this->nowPage  = !emptyempty($_GET[$this->varPage])?intval($_GET[$this->varPage]):1; 
64.         if(!emptyempty($this->totalPages) && $this->nowPage>$this->totalPages) { 
65.             $this->nowPage = $this->totalPages; 
66.         } 
67.         $this->firstRow = $this->listRows*($this->nowPage-1); 
68.  
69.         return $this->nowPage; 
70.     } 
71.  
72.     public function setConfig($name,$value) { 
73.         if(isset($this->config[$name])) { 
74.             $this->config[$name]    =   $value; 
75.         } 
76.     } 
77.  
78.  
79.     public function show() { 
80.         if(0 == $this->totalRows) return ''; 
81.         $p = $this->varPage; 
82.         $nowCoolPage      = ceil($this->nowPage/$this->rollPage); 
83.         $url  =  $_SERVER['REQUEST_URI'].(strpos($_SERVER['REQUEST_URI'],'?')?'':"?").$this->parameter; 
84.         $parse = parse_url($url); 
85.         if(isset($parse['query'])) { 
86.             parse_str($parse['query'],$params); 
87.             unset($params[$p]); 
88.             $url   =  $parse['path'].'?'.http_build_query($params); 
89.         } 
90.         //上下翻页字符串 
91.         $upRow   = $this->nowPage-1; 
92.         $downRow = $this->nowPage+1; 
93.         if ($upRow>0){ 
94.             $upPage="<a class='ajaxify' id='big' href='JavaScript:".$this->ajax_func."(".$upRow.")'>".$this->config['prev']."</a>"; 
95.         }else{ 
96.             $upPage=""; 
97.         } 
98.  
99.         if ($downRow <= $this->totalPages){ 
100.             $downPage="<a class='ajaxify' id='big' href='javascript:".$this->ajax_func."(".$downRow.")'>".$this->config['next']."</a>"; 
101.         }else{ 
102.             $downPage=""; 
103.         } 
104.         // << < > >> 
105.         if($nowCoolPage == 1){ 
106.             $theFirst = ""; 
107.             $prePage = ""; 
108.         }else{ 
109.             $preRow =  $this->nowPage-$this->rollPage; 
110.             $prePage = "<a class='ajaxify' id='big' href='javascript:".$this->ajax_func."(".$preRow.")'>上".$this->rollPage."页</a>"; 
111.             $theFirst = "<a class='ajaxify' id='big' href='javascript:".$this->ajax_func."(1)' >".$this->config['first']."</a>"; 
112.         } 
113.         if($nowCoolPage == $this->coolPages){ 
114.             $nextPage = ""; 
115.             $theEnd=""; 
116.         }else{ 
117.             $nextRow = $this->nowPage+$this->rollPage; 
118.             $theEndRow = $this->totalPages; 
119.             $nextPage = "<a class='ajaxify' id='big' href='javascript:".$this->ajax_func."(".$nextRow.")' >下".$this->rollPage."页</a>"; 
120.             $theEnd = "<a class='ajaxify' id='big' href='javascript:".$this->ajax_func."(".$theEndRow.")' >".$this->config['last']."</a>"; 
121.         } 
122.         // 1 2 3 4 5 
123.         $linkPage = ""; 
124.         for($i=1;$i<=$this->rollPage;$i++){ 
125.             $page=($nowCoolPage-1)*$this->rollPage+$i; 
126.             if($page!=$this->nowPage){ 
127.                 if($page<=$this->totalPages){ 
128.                    $linkPage .= "&nbsp;<a class='ajaxify' id='big' href='javascript:".$this->ajax_func."(".$page.")'>&nbsp;".$page."&nbsp;</a>"; 
129.                 }else{ 
130.                     break; 
131.                 } 
132.             }else{ 
133.                 if($this->totalPages != 1){ 
134.                     $linkPage .= "&nbsp;<span class='current'>".$page."</span>"; 
135.                 } 
136.             } 
137.         } 
138.         $pageStr  =  str_replace( 
139.             array('%header%','%nowPage%','%totalRow%','%totalPage%','%upPage%','%downPage%','%first%','%prePage%','%linkPage%','%nextPage%','%end%'), 
140.             array($this->config['header'],$this->nowPage,$this->totalRows,$this->totalPages,$upPage,$downPage,$theFirst,$prePage,$linkPage,$nextPage,$theEnd),$this->config['theme']); 
141.         return $pageStr; 
142.     } 
143.  
144. } 
145.  
146. ?> 

1. //实例化数据模型 
2.        $info=M('info'); 
3.        //统计要查询数据的数量 
4.        $count=$info->where("ID='$id'")->count(); 
5.        //实例化分页类，传入三个参数，分别是数据总数、每页显示的数据条数、要调用的jQuery ajax方法名 
6.        $p=new \Host\Common\AjaxPage($count,10,'server'); 
7.        //产生分页信息 
8.        $page=$p->show(); 
9.        //要查询的数据,limit表示每页查询的数量，这里为10条 
10.        $data = $server_info->where("ID='$id'")->limit($p->firstRow.','.$p->listRows)->select(); 
11.        //assign方法往模板赋值 
12.        $this->assign('list',$data); 
13.        $this->assign('page',$page); 
14.        //ajax返回信息 
15.        $res["content"] = $this->fetch('Index/myinfolist') 
16.        $this->ajaxReturn($res); 

1. <!DOCTYPE html> 
2. <head> 
3. </head> 
4.     <div id="server"> 
5.         <div class="row-fluid"  > 
6.             <div class="span12"> 
7.                 <div class="portlet box green"> 
8.                     <div class="portlet-title"> 
9.                         <div class="caption"><i class="icon-globe"></i>信息列表</div> 
10.                     </div> 
11.  
12.                     <div class="portlet-body" > 
13.                  
14.                         <table class="table table-striped table-bordered table-hover table-full-width" id="sample_1"> 
15.  
16.                             <thead> 
17.  
18.                                 <tr> 
19.                                     <th class="hidden-480">a</th> 
20.                                     <th class="hidden-480">b</th> 
21.                                     <th class="hidden-480">c</th> 
22.                                     <th class="hidden-480">d</th> 
23.                                 </tr> 
24.  
25.                             </thead> 
26.  
27.                             <tbody> 
28.                                     //循环赋值 
29.                                     <foreach name='list' item='info'> 
30.                                         <tr> 
31.                                             <td>{$info.a}</td> 
32.                                             <td>{$info.b}</td>      
33.                                             <td>{$info.c}</td> 
34.                                             <td>{$info.d}</td> 
35.                                           
36.                                         </tr> 
37.                                     </foreach> 
38.                                  
39.                             </tbody> 
40.                              
41.                         </table> 
42.                         //分页信息 
43.                         <div class="row-fluid"> {$page} </div> 
44.                          
45.                     </div> 
46.                 </div>     
47.             </div>         
48.         </div> 
49.     </div> 
50.      
51.     <script src="__PUBLIC__/server.js"></script>  

3.js部分

这一步是实现ajax无刷新分页的重点，用到了jQuery的ajax通信，通过与数据库的ajax交互，将获取到的数据写到模板中，替换掉之前的数据集，达到分页的目的。
server.js

1. function server(id){   
2.          var id = id; 
3.             $.get('/Server/myinfo', {'p':id}, function(data){   
4.             //用get方法发送信息到Server中的myinfo方法 
5.              $("#server").replaceWith("<div  id='user7'>" 
6.              +data.content+ 
7.              "</div>");  
8.         }); 
9.     }