Xiaobai's brief introduction to the use of laypage paging-php手册-php.cn

Xiaobai's brief introduction to the use of laypage paging

WBOY

Release： 2016-08-04 08:56:24

Original

1271 people have browsed it

I am a novice, so I used to use the built-in paging. Later, a master recommended this to me. It felt good, so I recommended it. Paging generally uses GET to pass values, so once you want to perform a search, , you need to add the search value to the URL, otherwise you will click on the next page and the search conditions will be erased. This is your first post. (Welcome experts to give me some suggestions for improvement). It is mainly written for fellow novices who are struggling. Friends, watch it (encourage each other).
//这里是前端页面需要引入的文件，去 http://laypage.layui.com/ 官网下载放在项目下即可（我将文件放在了Public下，然后再调用出来），<script src="/Public/laypage/laypage.js"></script>//好像很实用的样子，后端的同学再也不用写分页逻辑了。这里只要复制进来就可以了。不用改<script> laypage({ cont: 'page11', pages: 18, //假设我们获取到的是18（后端计算完总页数后将总页数值传过来，放在这里即可（类似{$totalpage}））. curr: function(){ //通过url获取当前页，也可以同上（pages）方式获取 var page = location.search.match(/page=(\d+)/); return page ? page[1] : 1;//如果没有页数显示时，默认是第一页 }(), jump: function(e, first){ //触发分页后的回调 if(!first){ //一定要加此判断，否则初始时会无限刷新 location.href=setParam("page",e.curr); } } });//设置url中连接符（为什么要加这段呢？因为我们要带搜索条件时，一般的URL要带"？","&"，这两个符号，这里就是为了，在追加页码时，当有了“？”符号时，会换成“&”，没有时则是“？”加page=页数，以下也是直接复制进去就可以了。）function setParam(param,value){ var query = location.search.substring(1); var p = new RegExp("(^|)" + param + "=([^&]*)(|$)"); if(p.test(query)){ //query = query.replace(p,"$1="+value); var firstParam=query.split(param)[0]; var secondParam=query.split(param)[1]; if(secondParam.indexOf("&")>-1){ var lastPraam=secondParam.split("&")[1]; return '?'+firstParam+'&'+param+'='+value+'&'+lastPraam; }else{ if(firstParam){ return '?'+firstParam+''+param+'='+value; }else{ return '?'+param+'='+value; } } }else{ if(query == ''){ return '?'+param+'='+value; }else{ return '?'+query+'&'+param+'='+value; } } } </script>//最后在你显示数据（例如后）最后添加下面这个<div style="margin-top:15px; text-align:center;" id="page11"></div>//The above id is set by yourself. If you change it, pay attention to the previous cont: 'page11', which also needs to be changed here. The preparations for the front end are now complete.
If the search terms also need to include a URL address, here’s what I wrote
//Click to search$("#sou").bind("click",function(event){ Event.preventDefault();//If you don’t understand here, you can check it yourself (the default behavior for canceling events is usually when there is <from>, if not, just remove it directly). var type=$("#type").val();//Get the hypothetical search condition value var url=$(this).attr("souid");//Here is the address to jump to when clicking (for example: souid="<*:U('Custom/customorder')*&gt ;" Change the jump address yourself) window.location.href=url+"?typeid="+type; }); (Novices can only write like this, sorry, basic JQ should still be understandable!)

two. Now comes the backend partpublic function text(){ //The following is to get the page number sent by GET. If there is no page number, the page number is 1. $nowpage=I('page',1); //$totalpage is to calculate the maximum number of pages you want to obtain, ceil is rounded forward, here it is set to 10 pieces of data as 1 page (note the brackets). $totalpage=ceil((M('order')->where(condition) ->count())/10);//This is as abbreviated as possible. //Below, please add the sentence limit(($nowpage-1)*10,10), which means the data controls the number of data displayed on each page. After obtaining the number of pages, multiply it by the set number of data to obtain 10 items on the page. (Set it yourself) data $res=M('order')->where(condition) ->limit(($nowpage-1)*10,10) ->select(); //Finally, the data and the maximum number of pages are passed to the front end and accepted. (Search conditions must also be sent if required.) $this->assign("totalpage",$totalpage); $this->assign("res",$res); }