Yii2.0实现AJAX搜索分页

Posted 2022-11-26 wangjiuwang

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

[php]

view plain copy

1. $username = \\Yii::$app->request->post('username');  //接收搜索的数  

//2.定义一个Where条件 目的是让Sql语句 恒成立

[php]

view plain copy

1. $where = 1;  

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

[php]

view plain copy

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

[php]

view plain copy

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">  

  //渲染模板

[php]

view plain copy

1. return $this->renderPartial('index',['userInfo'=>$userInfo,'page'=>$str]);  

二，html页面展示如下

1.Script标签中书写如下

[php]

view plain copy

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>