질문Q #13853
ajax질문요
우왕2016-06-14 17:13:32

큰 화면이 있으면 특정 부분만 ajax로 불러왔습니다.

 

근데 그 부분을 페이징처리를 해야하는데...

 

큰 화면 url과 특정 부분의 url은 다르거든요

 

그래서 페이징 처리에 문제가 되는데......제가 방법을 못찾겠는데...

 

특정 부분 페이징처리 어떻게 할 수 있을까요...??

 

 

답변7
#1 kaido 2016-06-14 17:34:22

ajax로 페이지네이션 구축이 생각보다 쉽지가 않습니다.

당연하게도 그 큰화면이라는 것과 다르게 표현을 하고 싶어서 ajax를 사용하셨으니 주소와 파라메터값이 전혀 다를테구요.

 

당연하게도 ajax 페이지네이션 구축법은 조금 달라서, 페이지링크 처리를 별도로 처리해 줘야 합니다.

a 태그 그대로 사용 하시면 당연히 불협화음이 날테구요.

즉 ajax에 사용되는 파라메터를 전부 별도로 컨트롤 하셔야 합니다.

 

이 복잡하고 귀찮은 ajax 페이지네이션 구현에 대체 수단으로 ifream 이나 .load() 를 사용해서 구축 합니다.

#2 뫄뫄잉뿌 2016-06-14 17:34:44

ajax에 페이징처리에 관한 파라미터를 보내서 데이터를 받으면 됩니다. 가져온 데이터는 .html()를 통해 화면처리 되면 되죱.

참고로 ajax를 보내서 받은 페이지에 페이징처리도 같이 있어야합니다.

#3 이현재 2016-06-14 17:51:43
datatable 이라는 라이브러리가 있는데, 이를 커스텀해서 활용하는 것도 하나의 방법입니다. 당연히 ajax도 지원하고, 하나의 뷰에 여러 테이블을 불러와 활용할 수도 있습니다.
#4 욕쟁이꼬마 2016-06-14 23:48:02

다른 ajax 코드를 보니 전부 스크립트내에서 필요한 화면만 갱신시키더라고요.

가령 게시판같으면 스크립트내에서 게시판 쿼리날리고 바로 쿼리결과를 원하는 부분에 출력해서 갱신시키던데요.

의문점.. ci 에서 이와같이 구성하려면 frameset 으로 나누어서 따로따로 출력해줘야하나요? 아 웹코드도 어렵고 스크립도 어렵고ㅠㅠ

#5 우왕 2016-06-15 09:41:06

글쓴이입니다.

.load() 를 이용했는데요. 페이지 번호를 누르면

특정 부분에서 페이지 이동되는게 아니라 아예 큰 화면까지 다 바뀌는데요........

그럼 여기서 별도 파라메타를 구현해야하는건가요?

 

흐 복잡하네요

#6 천재작곡가 2016-06-15 09:58:10

저같은 경우는 게시판을 예로 들면

 

리스트를 불러오는 부분을 자바스크립트 함수로 하나 만들어놓고

코드이그나이터로 게시판 글 목록 부분만 json 형식으로 던져주는 걸 만듭니다.

{ status : true, total_count : 100, result : [  {  idx : 1,  title: ~~ },  { idx:2, title: ~~} ]

이런식으로 데이타를 받아와서

 

jqury tmpl 플러그인과

jquery pagination 플러그인 이용해서

내용 넣어줍니다

#7 kaido 2016-06-15 10:20:40

.load()의 경우iframe을 사용하지 않은 방법입니다.

즉 하나의 페이지에 동일한 레벨로 존재 한다는 소리입니다.

레이어를 하나의 load 영역으로 구분해서 파라메터를 구분해서 처리 하셔야 합니다.

가령..

 

<script>
$(".load_frame > a").click(function (){
...

ajax({ ... });

});
</script>

<form action="..."  id="load_form">
<input id="load_page" value="" />
<input id="load_total" value="" />
<input id="load_sfl" value="" />
<input id="load_stx" value="" />
</form>


<div class="load_frame">
... paging...
</div>

이런 구성이 되겠지요. 어려울것 없습니다.

 

.load() 의 장점은 다른 페이지의 데이터를 그대로 가져와서 그려준다는 점입니다.

일일이 직접 그릴 필요없고 호출하는 페이지에서 paging 처리를 끝낸 그림을 그대로 가져와서 그려주는 방식입니다.

알고보면 간단하면서 재미납니다.