ajax 페이징 유지
본문
common.lib.php
텝 메뉴 안에 get_paging을 이용해서 리스트 페이징을 구현했는데요.
리스트 페이지를 넘기니까 탬 메뉴의 위치가 유지되지 않고
탭 메뉴 1 번으로 넘어 갑니다.
get_paging 을 이용하면 탭 메뉴를 유지하는 방법이 있을까요?
아니면 ajax를 이용해서 하려고 하는데
참고할 소스가 있나요?
답변 1
안녕하세요?
불금인데 고생이 많으십니다.
탭이 동기식인지 비동기식인지 질문을 통해서 확인하기 어렵지만
만약 비동기식이라면 작업하기가 난해하실것 같습니다.
우선 두 가지 케이스 모두 설명드리겠습니다.
동기식 탭 (웹페이지 갱신하는 탭)--------------------
<!-- 페이지 -->
<?php
$_GET['tabidx']= '1'; //탭번호 수정 응용해서 쓰시면됩니다. 예시는 1인데 변수처리 해주셔야합니다.
$qstr .= "&tabidx=".$_GET['tabidx'];
$write_pages = get_paging(G5_IS_MOBILE ? $config['cf_mobile_pages'] : $config['cf_write_pages'], $page, $total_page, get_pretty_url($bo_table, '', $qstr.'&page='));
echo $write_pages;
?>
<!-- 페이지 -->
get_paging으로 탭값을 넘겨서 $_GET방식으로 받아오셔서 해당 탭에 맞게 활성화 해주시면 됩니다.
비동기식 탭 ( 웹페이지 갱신 없는 탭 )-------------------
우선 오소리님께서 두 가지를 생각해 주셔야합니다.
a. 탭 변경에 따라서 페이징 경로 부분에 탭 값 추가하기 ( 예] href='/bbs/board.php?bo_table=free&page=2&tabidx=2')
b. 넘긴 탭값을 $_GET으로 받아와서 jquery로 해당하는 탭 버튼을 click 트리거를 주시면 됩니다.
우선 바로 복사 붙여 넣기하는 그런 소스가 아니라 양해부탁드립니다
소스코드를 잘보시고 흐름을 파악하신다음에 응용을 해주셔야 합니다.^^
a. 탭 변경에 따라서 페이징 경로 부분에 탭 값 추가하기
<script>
$('.pg_page').each(function (idx, item) { //.pg_page 그누보드 기본 스킨 기준으로 되어있습니다. 이 부분도 스킨에 따라서 변경해 주셔야 합니다.
var curtab_id = "2"; // 이 부분 잘 응용해셔 쓰셔요 현재 선택된 탭값을 가져오시면 됩니다.
var turl = $('.pg_page').eq(idx).attr('href');
$('.pg_page').eq(idx).attr('href' , turl+"&tabidx="+curtab_id );
});
</script>
b. 넘긴 탭값을 $_GET으로 받아와서 jquery로 해당하는 탭 버튼을 click 트리거
<script>
//$_GET으로 탭아이디를 받아오 해당하는 탭으로 클릭 트리거를 주시면 됩니다.
//제가 오소리님의 퍼블을 본적이 없어서 탭아이디가 뭔값인지 몰라 임의로 넣은거라 변경해주셔야합니다.
$("#tab_<?=$_GET['tabidx']?>").trigger('click');
</script>
답변 감사합니다.
2가지 방법을 이용해서 시도해 보도록 하겠습니다.