Php로 웹 개발하기 : 게시판(9) - Pagination

게시판의 CRUD는 모두 구현하였다.

이번 포스팅에서는 출력되는 데이터의 개수에 따른 pagination을 넣어볼 것이다.

 

① 데이터 개수 구하기

<?php
    $conn = mysqli_connect('localhost', 'ID', 'PW', 'DBname');
    $sql = "SELECT * FROM board;";
    $result = mysqli_query($conn, $sql);
    echo mysqli_num_rows($result);
?>

mysqli_num_row() 함수를 사용하면 행의 개수를 구할 수 있다.

6개라고 잘 출력되었다.

 

 

② 페이지 개수 구하기

한 페이지에 결과를 10개씩 출력하려면 몇 페이지가 나오는지 구해보자.

$data_num = mysqli_num_rows($result);
$page_num = ceil($data_num / 10);

ceil 함수를 사용하면 간단하게 페이지 개수를 구할 수 있다.

 

③ pagination 생성

<div class = "pagination">
    <?php
        $page_num = ($data_num - $data_num % 10) / 10 + 1;
        for($i = 1; $i <= $page_num; $i = $i+1){
            echo "<div>".$i."</div>";
        }
    ?>
</div>

기존의 board.php의 하단에 pagination 부분을 만들어주고, for문을 사용해서 페이지 수를 출력해준다.

데이터 5개를 더 추가해서 2페이지가 뜨는지 확인해보자.

10개에서 11개가 되니 2페이지가 생겼다.

 

 

④ 페이지에 맞는 결과 출력

이 파트가 가장 어려운 부분이었다.

페이지 상에서는 가장 밑에 있는 부분인데, php 동작상으로는 가장 먼저 수행되어야 하는 부분이기 때문이다.

그래서 기존의 결과 출력 부분을 함수화 해주어 페이지 번호가 클릭되면, 번호에 맞는 데이터를 가져와서 출력하도록 구현하였다.

<div class = "pagination">
    <?php
        $conn = mysqli_connect('localhost', 'ID', 'PW', 'DBname');
        $sql = "SELECT * FROM board;";
        $result = mysqli_query($conn, $sql);

        $data_num = mysqli_num_rows($result);
        $page_num = ceil($data_num / 10);
    ?>
        <form method = "post">
            <?php
                for($i = 1; $i <= $page_num; $i = $i+1){
                    echo "<input type = 'submit' name = 'page' value = '$i'/>";
                }
            ?>
        </form>
</div>

Pagination 부분에서 데이터 개수를 구해서 페이지를 출력해준 후, 페이지 부분을 form으로 만들어서 원하는 페이지를 누르면 post 방식으로 value 값(페이지 번호)이 전달되도록 만들어주었다.

(원래는 페이지 부분을 Button으로 만들어주고 onclick으로 php 함수를 호출하려고 했는데, JavaScript(Client side)와 Php(Server side)의 해석 순서 차이로 인해 그렇게는 동작하지 않는다고 한다.)

<tbody>
    <?php
        if(array_key_exists('page', $_POST)){
            printpage($_POST['page']);
        }
        else{
        	printpage(1);
        }
        function printpage(int $page){
            $start_data = ($page - 1) * 10;
            if(array_key_exists('board_search', $_POST)){
                board();
            }
            else{
                $conn = mysqli_connect('localhost', 'ID', 'PW', 'DBname');
                $sql = "SELECT * FROM board limit $start_data, 10;";
                $result = mysqli_query($conn, $sql);
                while($row = mysqli_fetch_array($result)){
    ?>
                    <tr>
                        <td><?=$row['username']?></td>
                        <td><a href = 'read.php?id=<?=$row['id']?>'><?=$row['title']?></a></td>
                        <td><?=$row['views']?></td>
                        <td><?=$row['date']?></td>
                    </tr>
    <?php
                }
                mysqli_close($conn);
            }
        }
    ?>
</tbody>

 

기존의 표를 출력하는 부분을 printpage 함수로 만들어주고, post 방식으로 value 값이 넘어왔다면 value에 맞는 작업을 해주고 아니라면 초기 화면이 보여야 하므로 printpage(1)으로 1페이지를 출력해준다.

인자로 받은 페이지 번호가 1이면 MySQL 데이터는 0에서 10까지, 2라면 10에서 20까지 데이터를 출력해야하므로 limit을 사용해서 다음과 같이 SQL 구문을 만들어주었다.

$start_data = ($page - 1) * 10; // $page가 인자로 넘겨 받은 페이지 번호
$sql = "SELECT * FROM board limit $start_data, 10;";

 

 

기존 화면과 2 페이지를 눌렀을 때 잘 작동되는 것을 확인할 수 있다.