Yii2.0实现AJAX搜索、分页

这篇博客详细介绍了如何在Yii2.0框架下实现AJAX搜索和分页功能。通过接收并处理POST请求中的用户名,构造SQL查询条件,并结合分页参数,动态加载数据。同时,文章还展示了如何将搜索关键字高亮显示,并提供了前端的JavaScript函数实现AJAX请求,更新页面内容。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

//1.首先判断搜索的数据是否为空

  1. $username = \Yii::$app->request->post('username');  //接收搜索的数  
//2.定义一个Where条件 目的是让Sql语句 恒成立

  1. $where = 1;  

//3.判断数据是否存在,拼接搜索的语句。如果多条件搜索,则直接 and  连接 即可

  1. if(!empty($username)){  
  2.             $where = " username like '%$username%'";  
  3.         }  

  1. //4.接收页码  
  2.         $page = \Yii::$app->request->post('pages');  
  3.         //判断当前页码是否存在  
  4.         $pages = isset($page) ? $page : 1 ;  
  5.         //计算总条数  
  6.         $count = Username::find()->count();  
  7.         //设置每一页显示的条数  
  8.         $pageSize = 3 ;  
  9.         //计算总页数  
  10.         $pageSum = ceil($count/$pageSize);  
  11.         //计算偏移量  
  12.         $offset = ($pages - 1)*$pageSize;  
  13.         //计算上一页 下一页  
  14.         $last = $pages<=1 ? 1 : $pages-1 ;  
  15.         $next = $pages>=$pageSum ? $pageSum : $pages+1 ;  
  16.         //拼接A链接  
  17.         $str = '';  
  18.         $str .= "<a href='javascript:void(0);' οnclick='page(1)'>首页</a>";  
  19.         $str .= "<a href='javascript:void(0);' οnclick='page($last)'>上一页</a>";  
  20.         $str .= "<a href='javascript:void(0);' οnclick='page($next)'>下一页</a>";  
  21.         $str .= "<a href='javascript:void(0);' οnclick='page($pageSize)'>尾页</a>";  
  22.         //查询分页后的数据信息  
  23.         $sql = "select * from username where $where limit $offset,$pageSize";  
  24.         $userInfo = Username::findBySql($sql)->asArray()->all();  
  25. <pre name="code" class="php">       //搜索后关键字标红  
  26.       foreach($userInfo as $key => $value){  
  27.          $userInfo[$key]['username'] = str_replace($username,"<font color='red'>$username</font>",$value['username']);  
  28.       }  
  29. <pre name="code" class="php">  
  //渲染模板
  1. return $this->renderPartial('index',['userInfo'=>$userInfo,'page'=>$str]);  
二,HTML页面展示如下

1.Script标签中书写如下

  1. <script>  
  2.         function page(page){  
  3.             //获取搜索的数据  
  4.             var username = $("#username").val();  
  5.             //发送AJAX请求  
  6.             $.ajax({  
  7.              url:"?r=index/index",  
  8.              data:{pages:page,username:username},  
  9.              type:"POST",  
  10.              success:function(msg){  
  11.                     $("#body").html(msg);  
  12.                 }  
  13.              });  
  14.         }  
  15.     </script>  

//直接输出页码即可

<?= $page;?>

注意事项 : 点击搜索和分页,所触发的函数都是Page 方法。

<button οnclick="page()">搜索</button>
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值