ホームページ  >  記事  >  バックエンド開発  >  PHP+MySQL+LayUI ページングクエリ表示

PHP+MySQL+LayUI ページングクエリ表示

autoload
autoload転載
2021-04-12 16:17:002687ブラウズ

##htmlフロントエンド スタイルを構築し、AJAXデータを非同期的にリクエストしてから、 uselayui.table データ テーブルのメソッド レンダリングにより、ページング クエリの表示が完了します。

  • #html

    フロントエンド スタイルの構築

  • AJAX

    非同期リクエスト データ

  • layui.table

    データ テーブル メソッドを使用してレンダリングします。

1.HTML ファイル

<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> フロントエンドからページと制限変数を取得し、MySQL に渡します。 limit

ページング クエリを実行し、クエリ結果をアセンブルして、フロントエンド LayUI フレームワークによって指定された json 形式で返します。

2.laypage.php ファイルlaypage.php の機能は、データの総数を取得して先頭に返すことです。 -end 表示用。

<?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 ファイルlaypage.php の機能は、指定された変数パラメータに従ってページ内のデータをクエリすることです。フロントエンドを通過し、フロントエンドの展示場に戻します。

<?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;
    ?>

最終ページの効果は次のとおりです:


PHP+MySQL+LayUI ページングクエリ表示

推奨:

2021 PHP面接の質問のまとめ (集)》《php ビデオ チュートリアル

以上がPHP+MySQL+LayUI ページングクエリ表示の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はcsdn.netで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。