PHP+MySQL+LayUI paging query display

##htmlBuild the front-end style, AJAXrequest data asynchronously, and then uselayui.table Method rendering of data table, thus completing the paging query display.

• htmlBuild front-end style

• AJAXAsynchronous request data

• Use the

  layui.table data table method to render.

1.HTML file

<p>
        </p>

        

<script></script><script> var pageNum = 0; var limit = 10; var page = 1; $.ajax({ url: "laypage.php", async: false, type: "post", success: function (res) { pageNum = res; //取到数据总条数 // console.log(res) } }); layui.use(&#39;table&#39;, function () { var table = layui.table; table.render({ elem: &#39;#demo&#39;, method: &#39;post&#39;, url: &#39;paging.php&#39;, limit: limit, page: page, cellMinWidth: 80, //全局定义常规单元格的最小宽度，layui 2.2.1 新增 cols: [[ {checkbox: true}, {field: &#39;id&#39;, width: 80, sort: true, title: &#39;ID&#39;}, {field: &#39;donor&#39;, width: 240, sort: true, title: &#39;姓名/昵称&#39;}, {field: &#39;object&#39;, width: 180, sort: true, title: &#39;捐助项目&#39;}, {field: &#39;money&#39;, width: 150, sort: true, title: &#39;捐助金额&#39;}, {field: &#39;time&#39;, width: 200, sort: true, title: &#39;捐助时间&#39;}, {field: &#39;type&#39;, width: 100, sort: true, title: &#39;捐助类型&#39;}, {field: &#39;message&#39;, width: 200, title: &#39;备注/留言&#39;} ]] }); });</script> Get the page and limit variables from the front end and give them to MySQL

limit Perform paging query, assemble the query results and return them in the json format specified by the front-end LayUI framework.

2.laypage.php file

The function of laypage.php is to get the total number of data and return it to the front-end for display.

<?php     require (&#39;db_config.php&#39;);
    $sql = &#39;select count(*) from donation_copy1&#39;;
    $result = $mysqli->query($sql);
    $sum = mysqli_fetch_row($result);
    echo ceil($sum[0]/1);
?>

3.paging.php file

The function of laypage.php is to query the data in pages according to the variables passed by the front end and return it to the front end. exhibit.

<?php     header("content-type:text/html;charset=utf-8;");
    require (&#39;db_config.php&#39;);$limit = $_POST[&#39;limit&#39;];
    $page = $_POST[&#39;page&#39;];$new_page = ($page - 1)*$limit;
    $sql = "select * from donation_copy1 order by id desc limit " .$new_page.",".$limit;
    $result = $mysqli->query($sql);
    $sql2 = 'select * from donation_copy1';
    $count = mysqli_num_rows($mysqli->query($sql2));
    $arr = array();
    while ($row = mysqli_fetch_array($result)) {  
    $arr[] = $row;}$donation_data = array(  // 拼装成为前端需要的JSON
    'code'=>0,
    'msg'=>'',
    'count'=>$count,
    'data'=>$arr);
    echo json_encode($donation_data);
    //echo $sql;
    ?>

The final page effect is as follows:

Recommended: 《2021 PHP Summary of interview questions (collection)》《php video tutorial》

The above is the detailed content of PHP+MySQL+LayUI paging query display. For more information, please follow other related articles on the PHP Chinese website!