jQuery Paging 처리 (진행중....)

jQuery Paging 처리를 완벽하게 한 것은 아니지만 PHP 와 연동하여 기본적인 처리를 하도록 만들어봤다.

함수는 재귀호출이 가능하다는 점을 활용했다.

https://www.w3schools.com/bootstrap4/bootstrap_pagination.asp 에 Bootstrap 4 Pagination 에 대한 기본 설명이 잘 나왔다. Pagination 은 HTML 코드의 <ul>태그와 <li>태그를 활용하여 모양이 예쁜 Pagination 이 만들어진다.

보통 jQuery 와 연동되는 Pagination 처리에서는 href="#" 으로 해서 해당 URL로 연결되지 않고 jQuery 코드상에서 처리한다.

PHP 코드와 잘 연계하여 Paging 이 처리되는 함수를 만든 다음에 jQuery 와 연동하면 코드를 크게 고려하지 않고도 잘 만들 수 있을 거 같다.

function BBSListTable(where,keyword,curPage){     $('#panel_content').load('BBSList.php?where='+where+'&keyword='+keyword+'&p='+curPage, function() {         var curPage = $('#paging .act a').text();         $('#paging li').click(function(e) {             e.preventDefault();             switch($(this).text()){                 case '◁':                     curPage=parseInt($(this).next().text()) - 1;                     break;                 case '▷':                     curPage=parseInt($(this).prev().text()) + 1;                     break;                 default:                     curPage = $(this).text();                     break;             }             BBSListTable(where,keyword,curPage); // 재귀호출 가능         });         $('#BBSHome').click(function(e){             e.preventDefault();             BBSListTable('','','',1);         });         $('#BBSSearch').click(function(e){             var where = $('[name=where]').val();             var keyword = $('[name=keyword]').val();             if(keyword =='' || keyword == 'undefined'){                 alert('검색어를 입력하세요');                 $('input[name=keyword]').focus();                 return false;             }             BBSListTable(where,keyword,1);         });         // 검색어 초기화         $('#BBSKeywordReset').click(function(){             $('input[name=keyword]').val('');         });     }); }