-
Spring:댓글더보기(ajax.ver)JAVA 2021. 7. 26. 23:28
java 와 javascript 의 차이점 - 메서드에 매개변수의 유동성
void g(int a){} // in java g(); // 오류 //in javascript g(); // 실행 g(5); // 실행javascript 에는 undefined 형이 있기 때문에 매개변수를 넣야할 int a 부분에 아무것도 없어도 메서드가 실행된다.
그 값은 undefined 형으로 지정되어 있다.@ResponseBody 가 붙었을 때 반환형이 String 또는 void 형이면
/* 기존 컨트롤의 방식 */ @RequestMapping(...) public String process(){} // view명 반환으로 인식 /* ajax 연결 컨트롤의 방식 */ @RequestMapping(...) @ResponseBody public String process(){} // Data 반환으로 인식 // view 반환이 아님 @RequestMapping(...) @ResponseBody public void process(HttpServletRequest request, HttpServletResponse response, ...) // response 가 있기 때문에 혼자서 요청, 응답하여 이 컨트롤에서 작업이 끝난다고 인식
ajax 의 error
var 정상연결 = true; var 보여줄댓글수 = 3; function 화면갱신(){ if(정상연결){ $.ajax({ url:"/board/comments/${board.no}", type:"POST", success:function(result){ $("#comments").html(result); }, error:function(){ 정상연결:false; alert("연결오류"); } }); } } //비동기로 화면갱신! setInterval(화면갱신, 3000);error:function(){}
: 연결신호가 안가고 에러 날때 error:function(){} 로 가고
if(정상연결) 이 false 가 되어 setInterval() 이 실행되도 ajax() 연결이 작동하지 않는다아예 setInterval 를 멈추기
var 보여줄댓글수 = 3; function 화면갱신(){ $.ajax({ url:"/board/comments/${board.no}", type:"POST", contentType:"application/json", data:JSON.stringify({size:보여줄댓글수}), success:function(result){ $("#comments").html(result); }, error:function(){ clearInterval(intervalId); alert("연결오류"); } }); } //비동기로 화면갱신! var intervalId = setInterval(화면갱신, 3000);setInterval() : 인터벌 아이디를 반환한다.
clearInterval() : 인터벌 아이디를 매개값으로 넣으면 더 이상 setInterval() 이 작동 하지 않는다.
댓글 더보기
>> 게시물상세창.jsp
<script> var 보여줄댓글수 = 3; function 화면갱신(){ $.ajax({ url:"/board/comments/${board.no}", type:"POST", contentType:"application/json", data:JSON.stringify({size:보여줄댓글수}), success:function(result){ $("#comments").html(result); }, error:function(){ clearInterval(intervalId); alert("연결오류"); } }); } //비동기로 화면갱신! var intervalId = setInterval(화면갱신, 3000); // 중략.. </script> <body> // 중략.. <!--댓글 쓰기 부분 --> 댓글 <textarea cols=40 rows=5 id="contents"></textarea> <button type="button" onclick="댓글등록하다()">보내기</button><br> <!-- 댓글들 출력 부분 --> <div id="comments"></div> <!-- 더보기 --> <button type="button" onclick="더보기()">더보기</button> </body>>> 게시물컨트롤.java
1. JSON 을 String 으로 넘겨 객체가 된 걸 받을 클래스 생성
2. 컨트롤에 @RequestBody 로 1번의 객체를 매개변수로 넣는다
class DataSize{ int size; public int getSize() { return size; } public void setSize(int size) { this.size = size; } } // 중략.. @RequestMapping(value="board/comments/{no}", method = RequestMethod.POST, produces = "text/plain;charset=UTF-8") @ResponseBody public String 게시물댓글을출력하다(@PathVariable int no, @RequestBody DataSize dSize, HttpSession session) { RefInteger totalSize = new RefInteger(); List<Comment> comments = commentDAO.selectByBoardNo(no, dSize.size, totalSize); if(comments == null) {return "<p> 댓글이 없어요 </p>";} ModelAndView mv = new ModelAndView(); String html=""; html+="<p>댓글수는 "+totalSize.value +"</p>"; html+="<ul>"; for(Comment comment : comments) { html += "<li>"; html += String.format("<p>%s</p>", comment.getWriter().getName()); html += String.format("<p>%s</p>", comment.getWdate().toString()); html += String.format("<textarea cols=20 rows=5 readonly>%s</textarea><br>", comment.getContents()); html += "<button>좋아요</button><button>싫어요</button>"; html += "</li>"; } html+="</ul>"; return html; }JSON 으로 js 에서 볼 댓글의 size 를 넘겨준다
넘길때 JSON 을 객체형태로 보내기 때문에 보내는 size 를 int형으로 멤버변수를 둔 객체를 따로 만들어야 한다.'JAVA' 카테고리의 다른 글
Mybatis:설정하기 (0) 2021.07.27 BLOB 이미지파일업로드 (0) 2021.07.27 Spring:댓글(ajax.ver) (0) 2021.07.26 Spring: 댓글(iframe.ver) (0) 2021.07.26 Spring:댓글 (0) 2021.07.26