yii 利用 Pagination 做异步分页

1 php 后端

public function actionPage() {
        $data = User::find();  //User为model层,在控制器刚开始use了field这个model,这儿可以直接写Field,开头大小写都可以,为了规范,我写的是大写
        $pages = new Pagination(['totalCount' =>$data->count(), 'pageSize' => '30']);    //实例化分页类,带上参数(总条数,每页显示条数)
        $model=$data->offset($pages->offset)->limit($pages->limit)->all();
        
       
        
        $is_ajax = Yii::$app->request->isAjax ;
        if(!$is_ajax){
            return $this->render('show',[
                'datas' => $model ,
                'pages' => $pages,
            ]);exit;
        }
        $string = '' ;
        foreach ($model as $p){
           
            $string .='<li>'.$p['email'].'</li>';
        }
        
        echo json_encode(['datas' => $string,'pages' => LinkPager::widget(['pagination' => $pages])]);
        
    }

2 模板

   

<?php
use yii\helpers\Html;
use yii\widgets\ActiveForm;
use yii\widgets\LinkPager;
use yii\helpers\Url;
use yii\web\View;
?>

<html>
<?=Html::jsFile('@web/js/jquery-2.1.0.js')?>
<style>
* {  
    margin: 0;  
    border: 0;  
    padding: 0;  
    font-size: 13pt;  
}  
  
#page {  
    height: 40px;  
    border-top: #060 2px solid;  
    border-bottom: #060 2px solid;  
    background-color: #690;  
}  
  
#page ul {  
    list-style: none;  
    margin-left: 50px;  
}  
  
#page li {  
    display: inline;  
    line-height: 40px;  
}  
  
#page a {  
    color: #fff;  
    text-decoration: none;  
    padding: 20px 20px;  
}  
  
#page a:hover {  
    background-color: #060;  
}
</style>
<body>
<div>
  <ul id="lists">
       <?php foreach( $datas as $p) {  ?>
         <li><?php echo $p['email'];?></li>
       <?php }?>
  </ul>
</div>
<div id="page">
<?=LinkPager::widget(['pagination' => $pages,]);?>
</div>

<script>

$(function(){

    $(document).on('click','.pagination a',function(e){
        e.preventDefault();
        var url = $(this).attr('href');
        $.get(url,function(msg){
            //alert(msg);
            $('#lists').html(msg.datas);
            $("#page").html(msg.pages);
        },'json');
    });
});
</script>
</body>
</html>

转载于:https://my.oschina.net/u/588516/blog/1557280

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值