[PHP 강좌] 36. 관계형 게시판 만들기 4 - 글쓰기, 글목록, 글보기

안녕하세요.

관계형 게시판의 글 부분의 강좌를 시작합니다.

관계형 게시판은 댓글의 경우에는 그냥 저장하는 것이 아니라

댓글때문에 부모글과의 관계, 또 같은 등급의 댓글들간의 관계때문에 조금은 복잡한 과정을 통해서 글을 저장하게 됩니다.

또 목록에서도 이러한 부분까지 생각해서 정렬을 해야합니다.

순서는 글쓰기, 목록보기, 글보기, 글수정, 댓글쓰기, 글삭제의 순서로 진행됩니다.

오늘은 글쓰기, 목록보기, 글보기에 대해서 배워보도록 하겠습니다. (참고로 글쓰기는 로그인한 경우에만 글을 쓰는 것으로 하겠습니다.)

그러면 소스를 보고 이야기 하도록 하겠습니다.

<?
// 1. 공통 인클루드 파일
include ("./include.php");

// 2. 로그인 안한 회원은 로그인 페이지로 보내기
if(!$_SESSION[user_id]){
    ?>
    <script>
        alert("로그인 하셔야 합니다.");
        location.replace("board_login.php");
    </script>
    <?
}
// 3. 입력 HTML 출력
?>
<br/>
<table style="width:1000px;height:50px;border:5px #CCCCCC solid;">
    <tr>
        <td align="center" valign="middle" style="font-zise:15px;font-weight:bold;">글쓰기</td>
    </tr>
</table>
<br/>
<form name="bWriteForm" method="post" action="./board_write_save.php" style="margin:0px;">
<table style="width:1000px;height:50px;border:0px;">
    <tr>
        <td align="center" valign="middle" style="width:200px;height:50px;background-color:#CCCCCC;">글제목</td& gt;
        <td align="left" valign="middle" style="width:800px;height:50px;"><input type="text" name="b_title" style="width:780px;"></td>
    </tr>
    <tr>
        <td align="center" valign="middle" style="width:200px;height:200px;background-color:#CCCCCC;">글내용< /td>
        <td align="left" valign="middle" style="width:800px;height:200px;">
        <textarea name="b_contents" style="width:800px;height:200px;"></textarea>
        </td>
    </tr>
    <!-- 4. 글쓰기 버튼 클릭시 입력필드 검사 함수 write_save 실행 -->
    <tr>
        <td align="center" valign="middle" colspan="2"><input type="button" value=" 글쓰기 " onClick="write_save();"></td>
    </tr>
</table>
</form>
<script>
// 5.입력필드 검사함수
function write_save()
{
    // 6.form 을 f 에 지정
    var f = document.bWriteForm;

    // 7.입력폼 검사

    if(f.b_title.value == ""){
        alert("글제목을 입력해 주세요.");
        return false;
    }

    if(f.b_contents.value == ""){
        alert("글내용을 입력해 주세요.");
        return false;
    }

    // 8.검사가 성공이면 form 을 submit 한다
    f.submit();

}
</script>

[board_write.php 소스]

[실행화면]


소스를 보시면 주석만 보셔도 아실겁니다. 궁금하신건 댓글로 질문해 주세요.

다음은 글을 저장하는 소스입니다.

<?
// 1. 공통 인클루드 파일
include ("./include.php");

// 2. 로그인 안한 회원은 로그인 페이지로 보내기
if(!$_SESSION[user_id]){
    ?>
    <script>
        alert("로그인 하셔야 합니다.");
        location.replace("board_login.php");
    </script>
    <?
}

// 3. 넘어온 변수 검사
if(trim($_POST[b_title]) == ""){
    ?>
    <script>
        alert("글제목을 입력해 주세요.");
        history.back();
    </script>
    <?
    exit;
}

if(trim($_POST[b_contents]) == ""){
    ?>
    <script>
        alert("글내용을 입력해 주세요.");
        history.back();
    </script>
    <?
    exit;
}


// 4. 글저장
$sql = "insert into tb_board set b_reply = '', m_id = '".$_SESSION[user_id]."', m_name = '".$_SESSION[user_name]."', b_title = '".addslashes(htmlspecialchars($_POST[b_title]))."', b_contents = '".addslashes(htmlspecialchars($_POST[b_contents]))."', b_regdate = now()";
sql_query($sql);

// 5. 저장된 글번호 찾기
$b_idx = mysql_insert_id();

// 6. 글번호 저장
$sql = "update tb_board set b_num = '".$b_idx."' where b_idx = '".$b_idx."'";
sql_query($sql);

// 7. 글목록 페이지로 보내기
?>
<script>
alert(" 글이 저장 되었습니다.");
location.replace("./board_list.php");
</script>

[board_write_save.php 소스]

전과 달라진 점이 하나 보입니다. 4번에서 mysql 의 insert 문이 바뀐것을 알수있을것입니다.

전에는 " insert 테이블 (필드명) values (필드값) " 의 형태였는데 " insert into 테이블 set 필드명 = 필드값 " 의 형태로 바뀌었습니다.

둘다 사용이 가능하구요 지금 소스처럼 사용하면 같은 내용을 update 문에서도 사용할 수 있기 때문에 이렇게 사용해 봤습니다.

5번의 mysql_insert_id() 함수는 바로위에서 insert 된 데이터에서 자동증가된 항목의 값을 알수 있는 것입니다.

5번에서 알아낸 자동증가값 b_idx 값을 6번에서 b_num  필드에 저장합니다.

b_num 필드는 글 정렬시 사용하고 댓글들의 경우 부모글 즉 처음에 쓴 글과 같은 번호를 가집니다.

또 저장시 글제목과 글내용을 addslashes() 와 htmlspecialchars() 함수를 사용했습니다.

addslashes() 함수는 따옴표, 홑따옴표 같은 문자에 / 를 붙여주는 함수입니다.

즉 mysql 에 부적절한 쿼리 에러를 막기 위함입니다.

htmlspecialchars() 는 HTML 태그들을 기호로 바꾸어 출력시 HTML 태그가 작동하지 않도록 하는 함수입니다.

이것은 HTML 태그를 넣어 글보기시 화면을 조작하는것을 막기 위함입니다.

그러면 이제 목록보기를 만들어 보겠습니다.

<?
// 1. 공통 인클루드 파일
include ("./include.php");
?>
<br/>
<table style="width:1000px;height:50px;border:5px #CCCCCC solid;">
    <tr>
        <td align="center" valign="middle" style="font-zise:15px;font-weight:bold;">글목록</td>
    </tr>
</table>
<br/>
<table cellspacing="1" style="width:1000px;height:50px;border:0px;background-color:#999999;">
    <tr>
        <td align="center" valign="middle" width="5%" style="height:30px;background-color:#CCCCCC;">번호</td>
        <td align="center" valign="middle" width="60%" style="height:30px;background-color:#CCCCCC;">글제목</td>
        <td align="center" valign="middle" width="15%" style="height:30px;background-color:#CCCCCC;">글쓴이</td>
        <td align="center" valign="middle" width="20%" style="height:30px;background-color:#CCCCCC;">작성일</td>
    </tr>
<?

// 2. 페이지 변수 설정
if($_GET[page] && $_GET[page] > 0){
    // 현재 페이지 값이 존재하고 0 보다 크면 그대로 사용
    $page = $_GET[page];
}else{
    // 그 외의 경우는 현재 페이지를 1로 설정
    $page = 1;
}
// 한 페이지에 보일 글 수
$page_row = 10;
// 한줄에 보여질 페이지 수
$page_scale = 10;
// 페이징을 출력할 변수 초기화
$paging_str = "";

// 3. 전체 글 갯수 알아내기
$sql = "select count(*) as cnt from tb_board where 1";
$total_count = sql_total($sql);

// 4. 페이지 출력 내용 만들기
$paging_str = paging($page, $page_row, $page_scale, $total_count);

// 5. 시작 열을 구함
$from_record = ($page - 1) * $page_row;

// 6. 글목록 구하기
$query = "select * from tb_board where 1 order by b_num desc, b_reply asc limit ".$from_record.", ".$page_row;
$result = mysql_query($query, $connect);

// 7.데이터 갯수 체크를 위한 변수 설정
$i = 0;

// 8.데이터가 있을 동안 반복해서 값을 한 줄씩 읽기
while($data = mysql_fetch_array($result)){

    // 9. 댓글 앞에 붙을 기호 만들기
    $reply_str = "";
    $reply_depth = strlen($data[b_reply]);
    if ($reply_depth > 0){
        for ($k=0; $k<$reply_depth; $k++){
            $reply_str .= '&nbsp;&nbsp;&nbsp;';
        }
        $reply_str .= '┗';
    }

?>
    <tr>
        <td align="center" valign="middle" style="height:30px;background-color:#FFFFFF;"><?=($total_count - (($page - 1) * $page_row) - $i )?></td>
        <td align="center" valign="middle" style="height:30px;background-color:#FFFFFF;"><?=$reply_str?><a href="./board_view.php?b_idx=<?=$data[b_idx]?>&page=<?=$page?>"><?=$data[b_title]?></a></td>
        <td align="center" valign="middle" style="height:30px;background-color:#FFFFFF;"><?=$data[m_name]?></td>
        <td align="center" valign="middle" style="height:30px;background-color:#FFFFFF;"><?=substr($data[b_regdate],0,10)?></td>
    </tr>
<?
    // 10.데이터 갯수 체크를 위한 변수를 1 증가시킴
    $i++;
}

// 11.데이터가 하나도 없으면
if($i == 0){
?>
    <tr>
        <td align="center" valign="middle" colspan="4" style="height:50px;background-color:#FFFFFF;">자료가 하나도 없습니다.</td>
    </tr>
<?
}
?>
</table>
<br/>
<table style="width:1000px;height:50px;">
    <tr>
        <td align="center" valign="middle"><?=$paging_str?></td>
    </tr>
    <?// 12. 로그인 한 경우면 글쓰기 버튼 보여주기?>
    <?if($_SESSION[user_id]){?>
    <tr>
        <td align="center" valign="middle"><input type="button" value=" 글쓰기 " onClick="location.href='./board_write.php';"></td>
    </tr>
    <?}?>
</table>

[board_list.php 소스]

[실행화면]


소스에서 주의해야할 부분만 설명 드리겠습니다.

4번은 전에 만들어 두었던 사용자 정의 함수 paging() 을 썼습니다.

6번의 목록을 구하는 쿼리문에서 order by b_num desc, b_reply asc 부분을 눈여겨 봐야합니다.

저 문장의 뜻은 b_num 필드를 큰것부터 정렬하고 그 후 b_reply 필드로 작은것부터 정렬하라는 뜻입니다.

우리가 댓글을 쓸때 b_num 은 댓글의 부모가 되는 글의 b_num 을 그대로 사용할 것입니다.

그래서 먼저 b_num으로 정렬하면 부모글과 댓글들이 먼저 한군데 뭉쳐지게 됩니다.

그리고 b_reply 는 댓글들의 단계와 순서를 정하는 필드입니다.

이것을 정렬함으로서 댓글들의 순서가 정확하게 나오는 것입니다.

예를들어 b_num 이 1 인 글에 댓글을 하나 달면 댓글의 b_num 은 1이 되고 b_reply 는 첫단계 첫 댓글이므로 A 가 됩니다.

만약 이 부모글에 댓글을 더 달면 B, 위의 댓글에 댓글을 달면 AA 식으로 댓글의 단계는 3단계 까지 한 단계의 댓글은 26개까지 가능하게 설계 하였습니다.

9번의 경우 b_reply 의 글자수를 알아내서 댓글이라는 표시를 해주는 부분입니다.

12번은 글쓰기 버튼을 로그인 여부를 검사해서 로그인 한 경우만 보여주게 하는 내용입니다.

이제 글보기 를 만들어 보도록 하겠습니다.

<?
// 1. 공통 인클루드 파일
include ("./include.php");

// 2. 글 데이터 불러오기
$sql = "select * from tb_board where b_idx = '".$_GET[b_idx]."'";
$result = sql_query($sql);
$data = mysql_fetch_array($result);

// 3. 글이 없으면 메세지 출력후 되돌리기
if(!$data[b_idx]){
    ?>
    <script>
        alert("존재하지 않는 글입니다.");
        history.back();
    </script>
    <?
}
// 4. 출력 HTML 출력
?>
<br/>
<table style="width:1000px;height:50px;border:5px #CCCCCC solid;">
    <tr>
        <td align="center" valign="middle" style="font-zise:15px;font-weight:bold;">글보기</td>
    </tr>
</table>
<br/>
<table cellspacing="1" style="width:1000px;height:50px;border:0px;background-color:#999999;">
    <tr>
        <td align="center" valign="middle" style="width:200px;background-color:#CCCCCC;">글제목</td>
        <td align="left" valign="middle" style="width:800px;background-color:#FFFFFF;padding:5px;"><?=$data[b_title]?></td>
    </tr>
    <tr>
        <td align="center" valign="middle" style="width:200px;background-color:#CCCCCC;">작성자</td>
        <td align="left" valign="middle" style="width:800px;background-color:#FFFFFF;padding:5px;"><?=$data[m_name]?></td>
    </tr>
    <tr>
        <td align="center" valign="middle" style="width:200px;background-color:#CCCCCC;">작성일</td>
        <td align="left" valign="middle" style="width:800px;background-color:#FFFFFF;padding:5px;"><?=substr($data[b_regdate],0,10)?></td>
    </tr>
    <tr>
        <td align="center" valign="middle" style="width:200px;background-color:#CCCCCC;">글내용</td>
        <td align="left" valign="top" style="width:800px;background-color:#FFFFFF;padding:5px;"><?=nl2Br($data[b_contents])?></td>
    </tr>
</table>
<br/>
<table style="width:1000px;height:50px;">
    <tr>
        <td align="center" valign="middle">
        <input type="button" value=" 목록 " onClick="location.href='./board_list.php?page=<?=$_GET[page]?>';">
        <?// 5. 로그인 한 경우면 글쓰기,댓글쓰기 버튼 보여주기?>
        <?if($_SESSION[user_id]){?>
        &nbsp;&nbsp;<input type="button" value=" 글쓰기 " onClick="location.href='./board_write.php';">
        &nbsp;&nbsp;<input type="button" value=" 댓글쓰기 " onClick="location.href='./board_reply.php?b_idx=<?=$data[b_idx]?>';">
        <?}?>
        <?// 6. 자신의 글이면 삭제하기 버튼 보여주기?>
        <?if($_SESSION[user_id] == $data[m_id]){?>
        &nbsp;&nbsp;<input type="button" value=" 삭제하기 " onClick="board_delete('<?=$data[b_idx]?>');">
        <?}?>
        </td>
    </tr>
</table>
<script>
function board_delete(b_idx)
{
    if(confirm('댓글을 포함한 글을 삭제 하시겠습니까?')){
        location.href='./board_delete.php?b_idx=' + b_idx;
    }
}
</script>

[board_view.php 소스]

[실행화면]


위의 소스에서 글내용부분을 보면 nl2Br() 함수가 있습니다.

이 함수는 뉴라인 즉 textarea에서 엔터로 줄띄우기를 한것을 <br> 태그로 바꿔줍니다.

그리고 마지막의 자바스크립트 함수 board_delete() 함수는 b_idx 를 인자로 받아서 사용합니다.

이 함수안에 사용된 confirm() 은 ()안의 내용을 질문을 하고 예나 아니오로 대답했을 경우 true와 false 로 결과값을 받습니다.

즉 질문에 예라고 답하면 if 문안의 내용을 실행한다는 함수입니다.

그리고 문자열을 붙이는 것이 PHP 에서는 . 을 사용했다면 자바스크립트에서는 + 를 사용합니다.

오늘은 관계형 게시판의  글쓰기, 목록보기, 글보기를 배웠습니다.

다음시간에는 글수정, 댓글쓰기, 글삭제 방법을 배워보도록 하겠습니다.