ajax 댓글 (페이징 추가)
좀 오래됐지만, 허니짱님의 ajax 댓글을 좀 수정했습니다.
http://sir.co.kr/bbs/board.php?bo_table=g4_skin&wr_id=88141
원래 화일에서는, 댓글 보기와 작성 기능이 ajax였고 삭제기능이 빠져 있어서 추가했습니다.
/bbs/delete_comment_ajax.php
/bbs/view_comment_ajax.php
/bbs/write_comment_update_ajax.php
추가라고 해봐야, 원래 화일 (/bbs/delete_comment.php)에서 마지막 goto_url문만 주석처리하고,
alert을 die로 바꿔서 클라이언트쪽에서 받아서 출력하게 한것 뿐이고요.
그리고 원래 글에서는, view_comment_ajax.php에서 include_once("$g4[path]/head.sub.php"); 를 추가하셨는데 (charset 문제라고 지적하면서), 제 경우에 그 안에 너무 많은 코드들이 들어있어서 ajax로 불러오는 것이 배보다 배꼽이 큰 경우가 되어 (속도가 페이지를 다시 로드 하는 것과 차이가 없어서) 그냥 주석처리 했습니다. 크롬,IE9에서는 별문제 없는데 다른 곳에서는 어떨지 모르겠네요. 문제가 있으면 다시 주석을 풀어주세요. 속도는 좀 느려집니다.
제가 추가 한 부분은, 댓글 페이징 처리인데, 기본틀은 쿠츠님의 방식 (http://sir.co.kr/bbs/board.php?bo_table=g4_tiptech&wr_id=3455 )을 이용하고, 이를 서버쪽에서 처리하도록 /bbs/view_comment_ajax.php 에 넣었습니다.
페이징 처리를 하기에, 기본 댓글 순서를 역순으로 선택했습니다. (view_comment.php의 주석처리된 sql문을 참조) 또한 댓글이 역순이므로 댓글 쓰는 칸도 댓글 위에 넣었고요 (view_comment.skin.php). 댓글 리스트 아래에 댓글 페이지 링크가 나옵니다.
한페이지당 댓글수는, view.skin.php의 8 line 쯤
$c_rows = 5; // 한페이지당 댓글수
를 조정하면 됩니다.
또한 댓글은, 기본적으로 보이지 않게 해두고, 클릭해야 처음 5개을 가져오도록 했는데, 이를 바꾸려면 view.skin.php의 23-28 line 쯤
$(document).ready(function() {
ajax_loading_image = $('').attr('src', '/img/ajax-loader.gif');
if(c_link) comment_load(c_link);
else $("#comment_ajax_starter").empty().html('댓글을 보시려면 클릭하세요.');
// else comment_load(); // - 디폴트 댓글 보이기
});
에서 주석처리된 else 를 풀고, 그 위의 else를 주석처리하면 됩니다.
마지막으로, 댓글의 주소로 직접 들어오는 경우 (주소에 #c_23 같은것이 붙는 경우)에도 맞는 페이지로 가도록은 했는데, 해당 위치로 옮기는 것은, ajax 로딩타임과 javascript 실행시점의 차이인지 작동을 안하네요.
function comment_load(c_wr_id) {
$("#comment_ajax_starter").empty().html(ajax_loading_image);
var c_url = "";
if(c_wr_id) c_url = "&c_wr_id="+c_wr_id;
$("#comment_ajax").load("./view_comment_ajax.php?bo_table=&wr_id=&c_rows="+c_url
// , function() { document.location.hash = hash; } // -- 작동하지 않는 부분
);
}
불행하게도 작동하는 링크를 올릴수가 없네요. 제가 있는 커뮤니티에서 시험적으로 잘 작동하고 있다고밖에는... ^^
------------ 2011/5/20 update ----------------
그누보드 최신버전 (4.34.03) 을 설치하고 테스트하면서 몇가지 오류를 잡았습니다.
최신버전의 basic skin을 기본으로 수정했고,
IE9에서 (모든 스크립트에러 보기하면서) 나온 몇가지 에러를 잡았으며,
list.skin.php의 댓글수도 맞게 변하도록 했습니다.
참, ajax.filter.php 를 bbs로 옮긴것을 가정해서 스킨을 고쳤기에, bbs/ajax.filter.php (원래는 스킨 디렉토리 모두에 각각 들어있는 화일) 로 첨부했습니다.
(참고로 위 스샷의 코멘트 앞의 작은 그림 보이는 형태는 아닙니다. basic 스킨 기반입니다.)
http://sir.co.kr/bbs/board.php?bo_table=g4_skin&wr_id=88141
원래 화일에서는, 댓글 보기와 작성 기능이 ajax였고 삭제기능이 빠져 있어서 추가했습니다.
/bbs/delete_comment_ajax.php
/bbs/view_comment_ajax.php
/bbs/write_comment_update_ajax.php
추가라고 해봐야, 원래 화일 (/bbs/delete_comment.php)에서 마지막 goto_url문만 주석처리하고,
alert을 die로 바꿔서 클라이언트쪽에서 받아서 출력하게 한것 뿐이고요.
그리고 원래 글에서는, view_comment_ajax.php에서 include_once("$g4[path]/head.sub.php"); 를 추가하셨는데 (charset 문제라고 지적하면서), 제 경우에 그 안에 너무 많은 코드들이 들어있어서 ajax로 불러오는 것이 배보다 배꼽이 큰 경우가 되어 (속도가 페이지를 다시 로드 하는 것과 차이가 없어서) 그냥 주석처리 했습니다. 크롬,IE9에서는 별문제 없는데 다른 곳에서는 어떨지 모르겠네요. 문제가 있으면 다시 주석을 풀어주세요. 속도는 좀 느려집니다.
제가 추가 한 부분은, 댓글 페이징 처리인데, 기본틀은 쿠츠님의 방식 (http://sir.co.kr/bbs/board.php?bo_table=g4_tiptech&wr_id=3455 )을 이용하고, 이를 서버쪽에서 처리하도록 /bbs/view_comment_ajax.php 에 넣었습니다.
페이징 처리를 하기에, 기본 댓글 순서를 역순으로 선택했습니다. (view_comment.php의 주석처리된 sql문을 참조) 또한 댓글이 역순이므로 댓글 쓰는 칸도 댓글 위에 넣었고요 (view_comment.skin.php). 댓글 리스트 아래에 댓글 페이지 링크가 나옵니다.
한페이지당 댓글수는, view.skin.php의 8 line 쯤
$c_rows = 5; // 한페이지당 댓글수
를 조정하면 됩니다.
또한 댓글은, 기본적으로 보이지 않게 해두고, 클릭해야 처음 5개을 가져오도록 했는데, 이를 바꾸려면 view.skin.php의 23-28 line 쯤
$(document).ready(function() {
ajax_loading_image = $('').attr('src', '/img/ajax-loader.gif');
if(c_link) comment_load(c_link);
else $("#comment_ajax_starter").empty().html('댓글을 보시려면 클릭하세요.');
// else comment_load(); // - 디폴트 댓글 보이기
});
에서 주석처리된 else 를 풀고, 그 위의 else를 주석처리하면 됩니다.
마지막으로, 댓글의 주소로 직접 들어오는 경우 (주소에 #c_23 같은것이 붙는 경우)에도 맞는 페이지로 가도록은 했는데, 해당 위치로 옮기는 것은, ajax 로딩타임과 javascript 실행시점의 차이인지 작동을 안하네요.
function comment_load(c_wr_id) {
$("#comment_ajax_starter").empty().html(ajax_loading_image);
var c_url = "";
if(c_wr_id) c_url = "&c_wr_id="+c_wr_id;
$("#comment_ajax").load("./view_comment_ajax.php?bo_table=&wr_id=&c_rows="+c_url
// , function() { document.location.hash = hash; } // -- 작동하지 않는 부분
);
}
불행하게도 작동하는 링크를 올릴수가 없네요. 제가 있는 커뮤니티에서 시험적으로 잘 작동하고 있다고밖에는... ^^
------------ 2011/5/20 update ----------------
그누보드 최신버전 (4.34.03) 을 설치하고 테스트하면서 몇가지 오류를 잡았습니다.
최신버전의 basic skin을 기본으로 수정했고,
IE9에서 (모든 스크립트에러 보기하면서) 나온 몇가지 에러를 잡았으며,
list.skin.php의 댓글수도 맞게 변하도록 했습니다.
참, ajax.filter.php 를 bbs로 옮긴것을 가정해서 스킨을 고쳤기에, bbs/ajax.filter.php (원래는 스킨 디렉토리 모두에 각각 들어있는 화일) 로 첨부했습니다.
(참고로 위 스샷의 코멘트 앞의 작은 그림 보이는 형태는 아닙니다. basic 스킨 기반입니다.)
첨부파일
|
댓글을 작성하시려면 로그인이 필요합니다.
로그인
댓글 45개
추천
제가 테스트 해볼수 없어서 도움을 드릴 방법이 없네요. -_-
혹시, 허니짱님의 원글에서 했듯이,
view_comment_ajax.com 의 head.sub.php 인클루드를 다시 해보시겠어요?
(솔찍히는 왜 인클루드 해야하는지 잘 모르지만, 허니짱님 코드에 보면 그 화일 인클루드 옆에 'charset' 때문이라고 했으니.. 혹시.. -_-)
위 대신 답변도 감사드립니다. ^^;
지금은 매번 댓글목록을 다시 불러오는 방식이라 엄청난 개선은 아닐겁니다.
댓글 하나하나를 따로 관리하는 방식으로 하면 아무래도 더 좋을것 같네요. 그건 나중에. ^^;
그대신 페이징을 하니까 아무래도 도움이 될것 같습니다.
직접 시험해 주셔서 고맙습니다. ^^
압축풀고 bbs란 폴더는 어디에 넣는건지요?
comment_ajax => 이폴더는 skin> board에 넣었는데 맞는건가요?
부탁드립니다^^;;
bbs 아래 화일들은, 이미 설치되어있는 그누보드 bbs에 넣으면 되고요,
comment_ajax 는 말씀대로 skin > board 에 넣으시면 됩니다.
활동지수가 되면 쪽지로 보내고 이 댓글을 삭제하겠습니다.
쪽지 내용은, 댓글 페이지를 클릭할때 화면이 댓글 리스트의 중간쯤으로 이동하는데
댓글 목록의 맨 위로 화면을 이동하려면 어떻게 하느냐 였습니다.
(우선 댓글 중간쯤으로 이동하는 것은 확인하지 못했습니다. 코드대로라면, 화면은 정지해있고 내용만 바뀌여야 합니다.)
skin/.../view_comment.skin.php 의 18 라인 (comment_page_load() 함수의 마지막 라인)을 다음과 같이 수정해 보세요.
$("#comment_ajax").load("./view_comment_ajax.php?bo_table=<?=$bo_table?>&wr_id=<?=$wr_id?>&c_rows=<?=$c_rows?>&c_page="+c_page, function() {
window.scrollTo(0, $("#commentContents").position().top);});
문제가 해결되었다니 다행이네요. ^^;
고맙습니다. ^^*
아~ 진작에 그누보드에서 검색해볼껄 그랬어요ㅠㅠ
아직 다운로드는 하지 않았지만, 저도 소스보고 짜집기 좀 하겠습니다^^
제 공부시간을 많이 단축시켜 주셨네요^^
다시 불러오는 부분이 한페이지를 다시 다 불러오는 것이라, 랙이 좀 있어서요..
다른 분이 훨씬 뛰어난 ajax 댓글을 만들고 계셨는데 스킨으로 등록은 안하신것 같네요..
새로 만드시면 스킨으로 올려주세요. ^^
테스트해보니 엄청 편리하네여.
그런데 뷰페이지에서 아웃로그인이 먹통입니다. 로그인 시도하면 한10초간 브라우저 멈춤;
파이어폭스,크롬,익스8 전부 동일현상 이며 익스8 에서 에러메시지가.. (Stack overflow at line 420) 나옵니다.
그리고 댓글 정렬을 기본정렬로 바꿨는데, 게시글 열람시 ,그리고 댓글을 쓰고난후 댓글 마지막 페이지로 이동되게 하는 방법이 궁금합니다.
제 기억에는 아웃로그인과 같이 있는 경우도 문제는 없었던것 같은데..
혹시 지금이라도 제 댓글을 보신다면, 문제가 발생하는 웹의 주소를 (쪽지이든) 알려주시면 직접 확인해보겠습니다.
그런데 한가지.. 목록에서 댓글만 새창으로 열기 했을때는 페이징이랑 댓글등록등이 안되는데 제가 잘못한건지 본래 그런건지 정상적으로 사용할 방법좀 알려주실순 없을까요? ^^;
아마도 댓글창을 새로 띄울때는 적용이 되지 않을 수 있습니다.
왜냐하면, 별도로 뜬 댓글창을 굳이 ajax로 처리할 필요없이
필요할때마다 새로 내용을 불러 오는 것이 나을것 같아서요.. ^^
근데 작업하다보니 자꾸 애로사항이 생기는데 한가지만 더 부탁드려볼게요..
bbs/write_comment_update_ajax.php 이파일에 // 사용자 코드 실행 이부분을 다 삭제처리해서 write_comment_update.tail.skin.php 파일을 사용할수가 없는데 그냥 코드만 넣으니 작동을 안하네요..
board/skin/comment_ajax/write_comment_update.tail.skin.php 파일을 사용할 방법이 있을까요? ^^
지금 생각해봐서는 그대로 뒀어도 상관없을것 같은데..
아마 그 아래의 goto_url 을 지운다는 것이, 그것까지 같이 지운듯 합니다.
원래 대로
// 사용자 코드 실행
@include_once("$board_skin_path/write_comment_update.skin.php");
@include_once("$board_skin_path/write_comment_update.tail.skin.php");
부분을 넣어두셔도 될것 같습니다.
댓글새로고침 버튼 하나 달려면 어떻게 해야하는지 혹시 아시나요? 전진님은 쉽게 하실것도 같아서 ㅎㅎ;
암튼 잘 쓰고 있어요.
tag 하나 만드셔서 onclick event에 comment_load() javascript 함수를 연결하면 되지 않을까 하네요. ^^;
<input type="button" onclick="comment_load();return false;" value="댓글 불러오기"/> 정도??
아마 그런데, 원래 comment_load 함수가 처음 댓글 불러오는데에 쓰이니까,
이미 불러온 댓글이 있다는 전제없이 만들어진 것이라,
다시 불러오기에서 어떻게 보일지는 잘 모르겠어요.. ^^;
아주 고맙게 잘쓰겠습니다. 아직 댓글이 별로 없어서 새로고침할일은 없네요 ㅋ
아.. 그리고 view.comment.skin.php 에 있는
<script type="text/javascript">
var current_c_page = <?=$c_page?>;
// comment 로드하기
function comment_page_load(c_page) {
$("#ajax_comment_page"+c_page+"_loading").empty().html('<img src="<?=$board_skin_path?>/img/ajax_loading.gif" width=10px>');
$("#comment_ajax").load("../m/view_comment_ajax.php?bo_table=<?=$bo_table?>&wr_id=<?=$wr_id?>&c_rows=<?=$c_rows?>&c_page="+c_page);
}
$(document).ready(function() {
if(<?=$c_total_count?>==0) $("#comment_count_<?=$wr_id?>").empty();
else $("#comment_count_<?=$wr_id?>").text("("+<?=$c_total_count?>+")");
});
</script>
이부분은 view.skin.php에 있는부분같아서 삭제했는데 삭제해도 되는건가요?
view.skin.php의 17줄과 25줄 맨 앞과
view_comment.skin.php의 17줄 맨앞에 '//' 를 넣어주시면 될듯 합니다.
그리고, 위 코드는 view_comment.skin.php에'만' 있습니다.
두 skin 화일에 있는 javascript는 *다릅니다.*
혹시 스킨코드를 적용하시다 중복 복사를 하셨는지 모르겠네요..
사용하다보니 댓글링크 #C_23 같이 링크 바로 클릭하고 들어왔을때 말씀하신대로 안되는부분이 있는데요.
혹시나 지금은 해결하셨나해서 여쭤봅니다.
이게 크롬에서만 작동을 안하고 파폭이랑 익스에선 정상적으로 댓글위치로 가네요. 페이징없는데도 익스만 안되던데..
그리고 댓글 + 추천은 사용이 어렵겠죠?
혹시 해결하셨으면 부탁좀 드릴게요. ㅎ
아마 js 이벤트 시작시점과 #엥커 이동 시점이 브라우져마다 틀려서 그렇지 않나 싶습니다.
ajax 추천을 말씀하시는 거라면, 다른분의 ajax 추천을 그냥 붙혀도 될것 같은데요..