[웹개발] 게시글 수정 기능

* 개인적인 공부 내용을 기록한 글입니다.

---

최종 화면

클릭하면 확대됩니다.

 

이전 포스팅

https://choco4study.tistory.com/40?category=1054456 

[웹개발] 게시글 작성 기능

https://choco4study.tistory.com/52?category=1054456 

[웹개발] 파일 업로드/다운로드 기능

---

게시글 수정 기능

 

 

0. 요약

[1] 작성자가 게시글을 조회하는 경우에만 [수정] 버튼이 나타나게끔 구현한다.

[2] [수정] 버튼을 클릭해 글수정 페이지로 넘어갔을 시, 기존의 제목 및 내용을 폼에 넣어준다.

 

 

1. 다음은 게시글 조회 페이지를 출력하는 view.php에 추가해줄 내용이다.

<?php
    if($_SESSION['user_id'] == $res_view['writer']){ ?>
        <div class=mine>
        	<button class=write onclick="window.location.href='update.php?id=<?=$res_view['id']?>'" type="button">수정</button>
        </div>
<?php } ?>

[1] 현재 로그인하고 있는 사용자가 해당 게시글의 작성자일 경우,

[2] [수정] 버튼을 출력한다.

[3] [수정] 버튼을 클릭하면 update.php로 넘겨주고, 동시에 GET으로 해당 게시글의 식별자 (= id) 를 전달해준다.

 

 

2. 다음은 게시글 수정 페이지를 출력할 update.php의 내용이다.

<?php
    session_start();
    $conn = mysqli_connect('localhost', 'choco', '7173', 'study_login');
    $id = $_GET['id'];
    
    $sql = "SELECT * FROM board WHERE id=$id";
    $res = mysqli_fetch_array(mysqli_query($conn, $sql));
    if($_SESSION['user_id'] != $res['writer']){
        echo "<script>alert('권한이 없습니다!');";
        echo "window.history.back()</script>";
        exit;
    }
?>

[1] GET으로 넘겨받은 해당 게시글의 식별자 (= id) 를 $id에 할당해준다.

[2] 해당 게시글의 기존 정보를 가져와준다.

[3] 현재 사용자가 해당 게시글의 작성자가 아닐 시, alert를 출력하고 exit 해준다.

 

<div class=head>글수정</div>
<div class=middle>
    <form method="post" action="update_ok.php" enctype="multipart/form-data" autocomplete="off">
        <p><input class=textform type=text size=25 name=title value='<?=$res['title']?>' required></p>
        <p><textarea class=textform cols=35 rows=15 name=content><?=$res['content'];?></textarea></p>
        <p><?=$res['file']?></p>
        <p><input class=file type=file name=file value=null></p>
        <p><input class=write type="submit" value="글수정"></p>
        <input type="hidden" name=id value=<?=$id?>>
    </form>
</div>

[1] 전체적인 폼의 형식은 write.php와 동일하다.

[2] 다른 점은, 기존의 내용을 폼에 각각 넣어줬다는 점이다.

 

[3] 파일의 경우, 새로운 파일을 선택하지 않을 시 기존 파일이 null로 덮어씌워지는 현상을 막기 위해,

[4] default value를 null로 세팅해준 뒤, 파일의 value가 null에서 변하지 않았을 시 update를 하지 않는 방향으로 구현했다.

[5] 새로운 파일을 선택하면 value가 더 이상 null이 아니기 때문에 정상적으로 update된다.

[6] 새로운 파일을 선택하지 않을 시에는 기존의 파일이 그대로 남는다.

[7] 그럼 파일을 삭제하고 싶으면 어떻게 하냐고...? 거기까지는 생각 안해봤다..ㅎ 더 좋은 방법이 있을텐데 나중에 발전시켜보는걸로...

 

[8] submit을 누르면 update_ok.php로 POST 해준다.

 

 

3. 다음은 게시글 수정을 실질적으로 처리할 update_ok.php의 내용이다.

<?php
    session_start();
    $conn = mysqli_connect('localhost', 'choco', '7173', 'study_login');
    $id = $_POST['id'];

    //파일업로드
    $error = $_FILES['file']['error'];
    $tmpfile = $_FILES['file']['tmp_name'];
    $filename = $_FILES['file']['name'];
    $folder = "../file/upload/".$filename;

    if( $error != UPLOAD_ERR_OK ) {
        switch( $error ) {
            case UPLOAD_ERR_INI_SIZE:
            case UPLOAD_ERR_FORM_SIZE:
                echo "<script>alert('파일이 너무 큽니다.');";
                echo "window.history.back()</script>";
                exit;
        }
    }

    move_uploaded_file($tmpfile, $folder);

    $title = $_POST['title'];
    $content = $_POST['content'];

    if(!$filename){
        $sql_update = "UPDATE board SET title = '$title', content = '$content' WHERE id=$id;";
    } else {
        $sql_update = "UPDATE board SET title = '$title', content = '$content', file = '$filename' WHERE id=$id;";
    }
        
    $res_update = mysqli_query($conn, $sql_update);

    if($res_update) {
        echo "<script>alert('게시글이 수정되었습니다.');";
        echo "window.location.replace('view.php?id=$id');</script>";
    } else {
        echo mysqli_error($conn);
    }
?>

[1] POST로 넘겨받은 해당 게시글의 식별자 (= id) 를 $id에 할당해준다.

[2] 전체적인 내용은 write_ok.php와 흡사하다.

[3] 이해가 어려울 시에는 맨 위에 링크해둔 이전 포스팅들을 참고한다.

 

[4] POST로 넘겨받은 파일의 value가 null일 시, 업로드가 진행되지 않기 때문에 $filename에 값이 없다.

[5] 따라서, $filename에 값이 없는 경우 $title과 $content만 update를 진행한다.

[6] $filename에 값이 있는 경우 (= 새로운 파일을 업로드한 경우) $title, $content, $filename 모두 update를 진행한다.