tp5-- 分页 异步刷新
<?php namespace app\index\controller; class Index { public function userlist() { $list = model('User')->paginate( 2, false, [ 'type' => 'Bootstrap', 'var_page' => 'page', //使用jqery 无刷新分页 'path' => 'javascript:AjaxPage([PAGE]);' ] ); return view('index/userlist', ['list' => $list]); } public function ajaxList() { $page = request()->param('apage'); if (!empty($page)) { $rel = model('User')->paginate(2, false, [ 'type' => 'Bootstrap', 'var_page' => 'page', 'page' => $page, 'path' => 'javascript:AjaxPage([PAGE]);', ]); $page = $rel->render(); $list = $rel->items(); } return json(['list' => $list, 'page' => $page]); } }
html部分
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> </head> <body> <table> <thead> <tr> <th>ID</th> <th>姓名</th> <th>密码</th> </tr> </thead> <tbody id="mylist"> {volist name='list' id='user'} <tr> <td>{$user.id}</td> <td>{$user.username}</td> <td>{$user.password}</td> </tr> {/volist} </tbody> <div id="result"> {$list->render()|raw} </div> </table> </body> </html> <script type="text/javascript" src="/static/js/jquery-3.4.1.js"></script> <script> var AjaxPage = function(page){ $.ajax({ url:'/index/index/ajaxList', type:'post', dataType:'json', data: {apage:page}, success:function(data){ $("#result").html(data.page); $('#mylist').empty(); $obj=''; for (var i=0;i<data.list.length;i++) { $obj=$obj+'<tr><td>'+data.list[i].id+'</td><td>'+data.list[i].username+'</td><td>'+data.list[i].password+'</td></tr>'; } $('#mylist').append($obj); } }); } </script>
╰︶﹉⋛⋋⊱⋋๑๑⋌⊰⋌⋚﹉︶╯