12. 상세페이지 댓글 페이징 (1)

페이징을 위한 클래스를 만든다. 이 클래스를 컨트롤러에 생성자를 만들어, 뷰로 보낼 예정이다.

 

 

 

Mapper에 수정할 것이 몇개 있다. Limit 방식으로 페이징 처리를 하기 위해, 모든 댓글 가져오는 부분에는 페이징을 위한 offset 파라미터를 하나 더 추가하고, 해당 영화의 모든 댓글 수를 추출할 메소드를 하나 더 만든다.

 

 

 

xml은 다음과 같이 만든다. 이미 만든 모든 댓글 조회에는 limit문을 추가하여, pageOffset 값을 변경하여, 페이징을 하려고 한다. 그리고 페이징을 위해 해당 영화의 전체 댓글의 갯수를 구하는 쿼리문 역시 작성한다.

 

 

 

뷰로 보낼 데이터들을 다음과 같이 설정한다. 댓글 부분과 페이징부분을 따로 가져가야 하기 때문에, DTO를 만들어서 각각 덩어리 두개를 저장하였다.

 

 

 

이미 만든 영화 상세페이지의 자바스크립트, 모든 영화 댓글을 불러오는 fetch에서 ?page= 로 파라미터값을 불러오게끔 하였다. 값이 1이면, 1을 불러오고, 2면 2를 불러온다.

 

 

 

컨트롤러로 가서 영화 댓글 get 부분을 다음과 같이 수정한다. 자바스크립트로 불러온 page 파라미터값을 offset을 위한 계산을 한다. 1이면 0, 2면 5, 3이면 10... limit는 이미 5로 고정이고, offset값으로 불러올 데이터값을 달리 한다. 페이징 클래스의 생성자에 파라미터 값을 넣고, commentDTO를 생성하여, 코멘트부분과 페이징부분에 서로 댓글 목록들과, 페이징 정보 목록을 집어 넣은 후, commentDTO를 뷰로 보낸다.

 

 

 

전체 데이터를 조회하면 다음과 같이 댓글과 페이징 데이터가 따로 저장되어있는것을 확인할 수 있다.

 

 

 

댓글 목록들을 create하는 자바스크립트로 들어가 수정을 한다. 코멘트부분은 코멘트 부분을 따로 빼 놓고,

 

 

 

페이징 부분도 페이징 부분의 정보를 따로 빼내어 페이징을 위한 html을 따로 만든다. 해당 버튼을 누르면, 해당 value값의 파라미터를 실은 모든 댓글 조회 함수가 실행된다. 이 파라미터가 아까 위에서 말한 page 파라미터에 실려 컨트롤러로 이동한다. 아 참고로. 다른곳에 있는 모든 댓글을 조회하는 함수의 파라미터값을 1로 수정해 놓는다. 그래야 맨 처음 댓글 데이터들이 나타난다.

 

 

 

확인 결과 페이징이 잘 된다.