XOOPS輕鬆架 - 線上書籍

:::

用AI學PHP8
========

1. 製作分頁一直是個麻煩事，大致需要以下幾個步驟： 
    1. 取得總文章數
    2. 根據一頁出現幾則，計算總頁數
    3. 取得當前頁碼
    4. 根據一頁出現幾則加上當前頁碼，就可使用 `all()` 函數取得範圍內的所有文章
    5. 最後放上分頁工具
2. 有AI相助就省事多了，一樣給AI提示詞： 
    ```markup
    如何利用all()函數搭配BootStrap5的分頁工具，來做出分頁功能？
    ```
3. AI給了兩部份，第一部份是取得總文章數的函數，請放到 `index.php `的最後 
    ```php
    function getTotalCount(): int
    {
        global $pdo;
        $stmt = $pdo->query("SELECT COUNT(*) FROM school_news");
        return (int) $stmt->fetchColumn();
    }
    
    ```
4. 最後是要在頁面上放上分頁工具，不過這個寫法是直接在HTML中，套用PHP程式的寫法，比較難維護，我們目前適用樣板引擎的作法也不適用以下寫法。 
    ```markup
    <?php
    // 假設 all() 函數和 getTotalCount() 函數已經在其他文件中定義，並且已經包含
    // require_once 'functions.php';
    
    // 設置每頁顯示的記錄數
    $perPage = 10;
    
    // 獲取當前頁碼（如果沒有設置，默認為1）
    $currentPage = isset($_GET['page']) ? (int)$_GET['page'] : 1;
    
    // 獲取總記錄數
    $totalCount = getTotalCount();
    
    // 計算總頁數
    $totalPages = ceil($totalCount / $perPage);
    
    // 確保當前頁碼在有效範圍內
    $currentPage = max(1, min($currentPage, $totalPages));
    
    // 計算 OFFSET
    $offset = ($currentPage - 1) * $perPage;
    
    // 獲取當前頁的新聞數據
    $news = all($offset, $perPage);
    
    // HTML 開始
    ?>
    
    <html lang="zh-TW">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>學校新聞列表</title>
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.css" rel="stylesheet">
    </head>
    <body>
        <div class="container mt-4">
            <h1>學校新聞列表</h1>
            
            <div class="row">
                <?php foreach ($news as $item): ?>
                <div class="col-md-6 mb-4">
                    <div class="card">
                        <div class="card-body">
                            <h5 class="card-title"><?= $item['news_title'] ?></h5>
                            <p class="card-text"><?= mb_substr($item['news_content'], 0, 100) ?>...</p>
                            <p class="card-text"><small class="text-muted">發布日期：<?= $item['report_date'] ?></small></p>
                        </div>
                    </div>
                </div>
                <?php endforeach; ?>
            </div>
    
            
            <nav aria-label="Page navigation">
                <ul class="pagination justify-content-center">
                    <li class="page-item <?= ($currentPage == 1) ? 'disabled' : '' ?>">
                        <a class="page-link" href="?page=<?= $currentPage - 1 ?>" tabindex="-1" aria-disabled="true">上一頁</a>
                    </li>
                    
                    <?php for ($i = 1; $i <= $totalPages; $i++): ?>
                        <li class="page-item <?= ($i == $currentPage) ? 'active' : '' ?>">
                            <a class="page-link" href="?page=<?= $i ?>"><?= $i ?></a>
                        </li>
                    <?php endfor; ?>
                    
                    <li class="page-item <?= ($currentPage == $totalPages) ? 'disabled' : '' ?>">
                        <a class="page-link" href="?page=<?= $currentPage + 1 ?>">下一頁</a>
                    </li>
                </ul>
            </nav>
        </div>
    
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/js/bootstrap.bundle.min.js"></script>
    </body>
    </html>
    
    ```
5. 因此，我們可以根據我們現況，請AI修改： 
    ```markup
    分頁導航部份是用smarty5做的，請改為smarty5語法，PHP會assign所有新聞$all_news給smarty5樣板檔
    ```
6. AI就能根據需求給出回應 
    ```php
    <?php
    require_once 'Smarty.class.php';
    // 假設 all() 函數和 getTotalCount() 函數已經在其他文件中定義，並且已經包含
    // require_once 'functions.php';
    
    // 初始化 Smarty
    $smarty = new Smarty();
    
    // 設置每頁顯示的記錄數
    $perPage = 10;
    
    // 獲取當前頁碼（如果沒有設置，默認為1）
    $currentPage = isset($_GET['page']) ? (int)$_GET['page'] : 1;
    
    // 獲取總記錄數
    $totalCount = getTotalCount();
    
    // 計算總頁數
    $totalPages = ceil($totalCount / $perPage);
    
    // 確保當前頁碼在有效範圍內
    $currentPage = max(1, min($currentPage, $totalPages));
    
    // 計算 OFFSET
    $offset = ($currentPage - 1) * $perPage;
    
    // 獲取當前頁的新聞數據
    $all_news = all($offset, $perPage);
    
    // 將數據分配給 Smarty
    $smarty->assign('all_news', $all_news);
    $smarty->assign('currentPage', $currentPage);
    $smarty->assign('totalPages', $totalPages);
    
    // 顯示模板
    $smarty->display('news_list.tpl');
    
    ```
7. <span id="cke_bm_6944S" style="display: none;"> </span>依據回應，我們修改 `index.php `的 `switch()`，基本上就是在執行製作分頁1~3的步驟，取得總文章數→根據一頁出現幾則（可以先改小一點 `$perPage = 3;`），計算總頁數→取得當前頁碼，如此，就可以算出應該要從第幾筆資料開始抓，也就可以傳給all()，請他抓出指定範圍的文章。
    
     
    ```php
    switch ($op) {
        case 'embed':
            # code...
            break;
    
        default:
            if (!empty($id)) {
                $smarty->assign('news', show($id));
                $op = "show";
            } else {
    
                // 設置每頁顯示的記錄數
                $perPage = 3;
    
                // 獲取當前頁碼（如果沒有設置，默認為1）
                $currentPage = isset($_GET['page']) ? (int) $_GET['page'] : 1;
    
                // 獲取總記錄數
                $totalCount = getTotalCount();
    
                // 計算總頁數
                $totalPages = ceil($totalCount / $perPage);
    
                // 確保當前頁碼在有效範圍內
                $currentPage = max(1, min($currentPage, $totalPages));
    
                // 計算 OFFSET
                $offset = ($currentPage - 1) * $perPage;
    
                $smarty->assign('currentPage', $currentPage);
                $smarty->assign('totalPages', $totalPages);
                $smarty->assign('all_news', all($offset, $perPage));
                $op = "main";
            }
            break;
    }
    ```
8. 最後只要將部份，取代原有 `templates/main.tpl` 的分頁工具就完成了！ 
    ```markup
    
    <nav aria-label="Page navigation">
        <ul class="pagination justify-content-center">
            <li class="page-item {if $currentPage == 1}disabled{/if}">
                <a class="page-link" href="?page={$currentPage - 1}" tabindex="-1" aria-disabled="true">上一頁</a>
            </li>
            
            {for $i=1 to $totalPages}
                <li class="page-item {if $i == $currentPage}active{/if}">
                    <a class="page-link" href="?page={$i}">{$i}</a>
                </li>
            {/for}
            
            <li class="page-item {if $currentPage == $totalPages}disabled{/if}">
                <a class="page-link" href="?page={$currentPage + 1}">下一頁</a>
            </li>
        </ul>
    </nav>
    ```
9. 最就是多寫幾篇文章，就可以看出分頁工具的效果囉！  
     ![](https://campus-xoops.tn.edu.tw/uploads/tad_book3/image/55/%E7%81%AB%E7%8B%90%E6%88%AA%E5%9B%BE_2024-08-04T00-04-43.992Z.png)
 
</body></html>

:::

書籍目錄

展開 | 闔起

快速登入

進階搜尋

https%3A%2F%2Fcampus-xoops.tn.edu.tw%2Fmodules%2Ftad_book3%2Fmarkdown.php%3Ftbdsn%3D2028

計數器

今天：
昨天：
總計：

MarkDown

書籍目錄

快速登入

計數器