频道导航

CI的AJAX分页另类实现

2020-05-20 Ajax 前端之家

前端之家收集整理的这篇文章主要介绍了CI的AJAX分页另类实现，前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。

看了一下CI的分页类没有写到关于AJAX的内容，也在论坛上看到其他几位大神写的分页类扩展，感觉其实是没有必要。

在现有的基础上做了一下小小的改动还是能实现的。

下面进入正题：

CI的原生分页类中有一个参数$config[anchor_class]

这个参数是用来设置分页链接的样式的，所以我们可以设置成这样：

$config [anchor_class] = "class=ajax_fpage" ;

然后在view部分这样采用禁止a便签默认动作的方法来取得AJAX的调取效果。

代码如下：

? 
   
<script> 
          
         $(.ajax_fpage).click( 
         function 
         (e){ 
        
         var 
         url = $( 
         this 
         ).attr(href); 
        
         $.get(url,{}, 
         (res){ 
        
$( 
         #show_what_table).html(res); 
        
         }); 
        
event.preventDefault(); 
        
         }); 
        
</script>

当ajax_fpage点击的时候，禁止a标签的默认动作，并得到href信息，然后用get方法取得href的内容，并更新dom.

这样一个完整的ajax分页就实现了。从而不需要对原始的类进行扩展了。

详细的PHP 代码如下：

 
         function 
         ContentList( 
         $id 
         , 
         $p 
         =0) 
        
         { 
        
         $this 
         ->load->library(pagination); 
        
         [base_url] = site_url(qyadmin/ContentList/. 
         ./. 
         ); 
        
[total_rows] =  
         ->admin->content_list( 
         PHP variable" style="background-color:initial!important; border-top-width:0px!important; border-right-width:0px!important; border-bottom-width:0px!important; border-left-width:0px!important; border-style:initial!important; border-color:initial!important; bottom:auto!important; float:none!important; height:auto!important; left:auto!important; line-height:2em!important; margin-top:0px!important; margin-right:0px!important; margin-bottom:0px!important; margin-left:0px!important; outline-width:0px!important; outline-style:initial!important; outline-color:initial!important; overflow-x:visible!important; overflow-y:visible!important; padding-top:0px!important; padding-right:0px!important; padding-bottom:0px!important; padding-left:0px!important; position:static!important; right:auto!important; top:auto!important; vertical-align:baseline!important; width:auto!important; font-family:'Courier New',1); 
        
         [per_page] = 5; 
        
[uri_segment] = 5;  
        
         [first_link] = FALSE; 
        
[last_link] = FALSE; 
        
         [full_tag_open] = <p>; 
        
[full_tag_close] = </p>; 
        
         [display_pages] = FALSE; 
        
->load->helper(url); 
        
         $skin_url 
         = base_url().APPPATH .  
         "views/templates" 
         ; 
        
[next_link] = <img src= 
         ".$skin_url./images/page_next.gif" 
         >; 
        
         [next_tag_open] = <li  
         class 
         = 
         "fr" 
         >; 
        
[next_tag_close] = </li>;  
        
         [prev_link] = <img src= 
         ".$skin_url./images/page_prev.gif" 
         >; 
        
[prev_tag_open] = <li  
         >; 
        
         [prev_tag_close] = </li>; 
        
[anchor_class] =  
         "ajax_fpage" 
         ; 
        
         ->pagination->initialize( 
         ); 
        
$content 
         =  
         [per_page],0)!important">->uri->segment(5)); 
        
         $fpage 
         ->pagination->create_links(); 
        
->smarty->assign(fpage,0)!important">); 
        
         ->smarty->assign(content,0)!important">); 
        
->smarty->view(show.tpl); 
        
         }