[이윰] 새로고침 없이 댓글을 달거나 삭제할 수 있는 ajax 댓글 시스템으로 교체하기

페이지 정보

shadow2fox shadow2fox 3,886 4 2 2018.12.11 14:35:15

평점

  • 평점 : 5점 (2명 참여)

본문

새로고침 없이 댓글을 달거나 삭제할 수 있는 ajax 댓글 시스템으로 교체하기
ajax 댓글 플러그인 v1.0 https://sir.kr/g5_plugin/4972

상기 그누보드 링크를 참고해서 수정하였다.

1. 그누보드5/eyoom/user_program/board/delete_comment.skin.php 파일을 열어 다음과 수정한다.
만약 delete_comment.skin.php 파일이 없다면 UTF-8(BOM 없음) 인코딩으로 만들어서 진행한다.

수정 전

<?php
    if (!defined('_GNUBOARD_')) exit;
    // Your Program - Start

    // Your Program - End

    // 변수 할당하기 - /eyoom/inc/tpl.assign.php 파일 참조
    $tpl->assign(array(
    ));
?>
수정 후

<?php
    if (!defined('_GNUBOARD_')) exit;
    // Your Program - Start

    delete_cache_latest($bo_table);
    echo G5_HTTP_BBS_URL.'/board.php?bo_table='.$bo_table.'&wr_id='.$write['wr_parent'];
    exit;

    // Your Program - End

    // 변수 할당하기 - /eyoom/inc/tpl.assign.php 파일 참조
    $tpl->assign(array(
    ));
?>

2. 그누보드5/eyoom/user_program/board/write_comment_update.skin.php 파일을 열어 다음과 수정한다.
만약 write_comment_update.skin.php 파일이 없다면 UTF-8(BOM 없음) 인코딩으로 만들어서 진행한다.

수정 전

<?php
    if (!defined('_GNUBOARD_')) exit;
    // Your Program - Start

    // Your Program - End

    // 변수 할당하기 - /eyoom/inc/tpl.assign.php 파일 참조
    $tpl->assign(array(
    ));
?>
수정 후

<?php
    if (!defined('_GNUBOARD_')) exit;
    // Your Program - Start

    delete_cache_latest($bo_table);
    echo G5_HTTP_BBS_URL.'/board.php?bo_table='.$bo_table.'&wr_id='.$wr['wr_parent'].'#c_'.$comment_id;
    exit;

    // Your Program - End

    // 변수 할당하기 - /eyoom/inc/tpl.assign.php 파일 참조
    $tpl->assign(array(
    ));
?>

3. ajax 댓글 시스템을 사용할 스킨 폴더에 view_comment.skin.html 파일을 열어 다음과 같이 수정한다.

onclick="return comment_delete();" 을 검색하여 다음과 같이 수정한다.

수정 전

onclick="return comment_delete();"
수정 후

onclick="return comment_delete(this);"


② <div class="view-comment"> 를 검색하여 다음과 같이 수정한다.

수정 전

    <div class="view-comment">
수정 후

    <div class="view-comment">
    <ajaxcomment>

<!--{? eyoom_board.bo_use_cmt_infinite == '1'}--> 를 검색하여 다음과 같이 수정한다.

수정 전

    <!--{? eyoom_board.bo_use_cmt_infinite == '1'}-->
수정 후

    </ajaxcomment>

    <!--{? eyoom_board.bo_use_cmt_infinite == '1'}-->

④ document.getElementById("btn_submit").disabled = "disabled"; 를 검색하여 다음과 같이 수정한다.

수정 전

    document.getElementById("btn_submit").disabled = "disabled";

    return true;
}
수정 후

    document.getElementById("btn_submit").disabled = "disabled";

    // ajax comment system
    $.ajax({
        url: f.action,
        type: 'POST',
        data: $(f).serialize(),
        dataType: 'html',
    })
    .done(function(str) {
        var tempDom = $('<output>').append($.parseHTML(str))
        var title = $('title', tempDom).text()
        if (title === '') {
            // 1. commentBox 원위치
            comment_box('', 'c')

            // 2. commentBox Form 리셋
            f.reset()

            // 3. 코멘트 출력
            $.ajax({
                url: str,
                type: 'GET',
                dataType: 'html'
            })
            .done(function(str2) {
                var tempDom2 = $('<output>').append($.parseHTML(str2))
                $('ajaxcomment').replaceWith($('ajaxcomment', tempDom2))
            })
        }

        <?php if ($is_guest) { ?>
        // 4. 캡차 리로드
        $('#captcha_reload').trigger('click')
        <?php } ?>

        document.getElementById("btn_submit").disabled = ""
    })

    return false;
}

⑤ function comment_delete() 를 검색하여 다음과 같이 수정한다.

수정 전

function comment_delete()
{
    return confirm("이 댓글을 삭제하시겠습니까?");
}
수정 후

function comment_delete(that)
{
    if (confirm('이 댓글을 삭제하시겠습니까?')) {
        // ajax comment system
        $.ajax({
            url: that.href,
            type: 'GET',
            dataType: 'html',
        })
        .done(function(str) {
            var tempDom = $('<output>').append($.parseHTML(str))
            var title = $('title', tempDom).text()
            if (title === '') {
                // 1. commentBox 원위치
                comment_box('', 'c')

                // 2. 코멘트 출력
                $.ajax({
                    url: str,
                    type: 'GET',
                    dataType: 'html'
                })
                .done(function(str2) {
                    var tempDom2 = $('<output>').append($.parseHTML(str2))
                    $('ajaxcomment').replaceWith($('ajaxcomment', tempDom2))
                })
            }

            <?php if ($is_guest) { ?>
            // 4. 캡차 리로드
            $('#captcha_reload').trigger('click')
            <?php } ?>
        })
    }

    return false
}
추천인 2
  • 012i1052u
    내사랑
  • skyfield4u
    하늘구장
shadow2fox
10
shadow2fox - 회원등급 : 자연/Level 147 - 포인트 : 2,613,666
레벨 147
경험치 3,240,414

Progress Bar 47.88%

- 가입일 : 2015-03-10 12:21:44
- 서명 : 인간에게 가장 큰 선물은 자기 자신에게 기회를 주는 것이다. - 크리스 가드너, Chris Gardner -
- 자기소개 : There's never a shortcut to happiness.

댓글4

하늘구장님의 댓글

skyfield4u
하늘구장 2018.12.11 20:08
와!! 대박 감사합니다 늘 이건 부러운 기능이였는데 이제서야 감격

shadow2fox님의 댓글

1/26
shadow2fox
shadow2fox 글쓴이 @하늘구장 2018.12.11 20:20
모두가 하나씩 발전했으면 좋겠습니다 서로가 윈윈

내사랑님의 댓글

012i1052u
내사랑 2018.12.11 14:42
좀 전에 댓글을 달고서 보니 뭔가 달라졌다 싶었는데 이런 고급 정보가 감사 감사 베리 감사요 저녁에 수정해야겠어요 룰루랄라

축하합니다. 첫 댓글로 74경험치를 획득하였습니다.

shadow2fox님의 댓글

1/26
shadow2fox
shadow2fox 글쓴이 @내사랑 2018.12.11 20:20
잘 사용하세요

Total 762926 페이지

제목 글쓴이 날짜 조회 추천
그누•영카트  댓글+1🏆 비밀글 특정 레벨이상 보여주기 루루아빠 2015.08.17 3,142 0
이윰  🏆 게시판 목록에서 제목 바탕 부분을 클릭해도 본문으로 이동하기 루루아빠 2015.09.20 3,137 0
CSS  🏆 webkit-transform 스타일이 마우스 오버시 보이는 flickering 증상 해결하기 루루아빠 2016.05.26 3,135 0
이윰  🏆 쪽지 보내기 textarea(쪽지내용) 높이 키우기 루루아빠 2015.09.24 3,135 0
그누•영카트  🏆 모바일에서 로고 이미지 올바르게 위치시키기 루루아빠 2015.10.11 3,130 0
그누•영카트  🏆 영카트 5.2.9.5 패치 루루아빠 2017.10.22 3,127 0
HTML5  🏆 Google Drive로 공유된 동영상 Jwplayer를 통해 플레이하기 루루아빠 2015.09.15 3,124 0
이윰  🏆 이윰빌더 태그 입력시 작은 따옴표(apostrophe)가 포함되면 삭제 안되는 문제 루루아빠 2016.02.26 3,122 0
이윰  🏆 인기검색어 관련 설정 바꾸기 루루아빠 2015.09.12 3,122 0
이윰  🏆 "카테고리"별 게시글 갯수 나타내기 루루아빠 2015.04.24 3,122 1
이윰  🏆 최신글 추출 시 공지글을 제외하기 루루아빠 2017.08.19 3,115 0
그누•영카트  🏆 그누보드 5.1.3 (PHP7 대응 MySQLi 지원 추가) 패치 루루아빠 2015.10.17 3,112 0
이윰  🏆 📸 Eyoom Builder 1.3.0 시즌3 루루아빠 2017.11.21 3,111 0
이윰  🏆 익명 게시판에 글 작성시 기본으로 익명 체크되게 하기 루루아빠 2015.03.28 3,111 0
그누•영카트  🏆 그누보드5.0.34 + 영카트5.0.34 보안 패치 루루아빠 2015.05.22 3,110 0
제로  댓글+1🏆 GD게시판의 썸네일을 이용해 겔러리 최근파일 빠르게 보여주기 루루아빠 2005.06.12 3,109 0
이윰  🏆 Eyoom Builder 1.1.10 패치 루루아빠 2015.10.06 3,108 0
이윰  🏆 Eyoom Builder 1.3.12 패치 루루아빠 2017.11.21 3,105 0
이윰  🏆 댓글에 이미지가 추가된 댓글을 수정할 경우 이미지가 삭제되는 버그 패치 루루아빠 2015.08.07 3,099 0
그누•영카트  🏆 영카트 5.2.9.4 패치 루루아빠 2017.09.25 3,096 0
이윰  🏆 이모티콘을 이윰빌더에 적용하기 위한 규칙 루루아빠 2015.07.23 3,095 0
이윰  🏆 1.1.0 패치 후 카테고리 사용하면 분류 선택시 미등록페이지로 나오는 문제 루루아빠 2015.05.21 3,093 0
제로  🏆 💾 [스킨만들기] list_notice.php(공지사항 출력)의 설명 루루아빠 2005.06.23 3,093 0
이윰  🏆 게시글 본문 보기에서 제목 클릭시 글 수정하기 루루아빠 2015.06.04 3,085 0
이윰  🏆 태그 더보기시 페이지당 태그 노출 갯수 조정하기 루루아빠 2016.08.25 3,084 0
그누•영카트  댓글+1🏆 🎞️ 접근차단 IP, 접근가능 IP로 인해 홈에 접근 불가될때 루루아빠 2015.11.21 3,084 0
이윰  댓글+3🏆 PHP 8.x 지원을 위한 암호화, 복호화 함수 shadow2fox 2021.02.16 3,082 3
이윰  🏆 해당 페이지에 적용된 템플릿언더바 전체 변수 확인하기 루루아빠 2017.02.24 3,082 0
그누•영카트  🏆 회원 닉네임 길이 제한두기 루루아빠 2015.03.28 3,079 0
그누•영카트  🏆 그누보드 5.1.2 패치 루루아빠 2015.10.11 3,077 0