[Spring][쇼핑몰 프로젝트][46] 댓글 체크 - 2

프로젝트 Github : https://github.com/sjinjin7/Blog_Project
프로젝트 포스팅 색인(index) : https://kimvampa.tistory.com/188

 

목표

댓글 체크 기능 구현

 저번 포스팅에 이어서 댓글 체크 기능 구현 뷰 구현을 목표로 합니다. 

 

 

순서

1. 뷰 구현

 

 

1. 뷰 구현

 goodsDetail의 댓글 등록 버튼 Javascript 메서드(엄밀히 말하면 Jquery 메서드)의 구현부 중 팝업창을 띄우는 코드 부분(그림 1-1)을 주석 처리해줍니다.

 

그림 1-1

 

 

 주석처리 한 코드는 댓글 체크를 서버에 요청 후 댓글이 없다는 결과 값을 받았을 때 동작하도록 만들어 줄 것입니다.

댓글 체크를 요청하는 ajax 코드를 작성합니다. 

 

		$.ajax({
			data : {
				bookId : bookId,
				memberId : memberId
			},
			url : '/reply/check',
			type : 'POST',
			success : function(result){

			}
		});

 

그림 1-2

 

 

 success 속성 값은 서버에서 댓글 체크 요청이 정상적으로 처리되었을 때 실행이 되는 함수입니다. 함수 구현부를 아래의 코드로 작성해줍니다.

 

 - 함수의 인자(result)는 서버에서 댓글 체크 수행 결과로 반환 해준 값입니다.

 - if문을 활용하여 result 값이 1(댓글이 존재) 일 경우 경고창을 0일 경우 주석처리했던 팝업창을 연느 코드가 동작하도록 작성했습니다.

 

				if(result === '1'){
					alert("이미 등록된 리뷰가 존재 합니다.")
				} else if(result === '0'){
					let popUrl = "/replyEnroll/" + memberId + "?bookId=" + bookId;
					console.log(popUrl);
					let popOption = "width = 490px, height=490px, top=300px, left=300px, scrollbars=yes";
					
					window.open(popUrl,"리뷰 쓰기",popOption);							
				}

 

그림 1-3

 

 

2. 테스트

 댓글이 없는 상품에서 테스트를 한번 해보고, 댓글이 있는 상품에 테스트를 하여 구현한 기능이 잘 동작하는지 확인합니다.

 

회원이 등록한 댓글이 존재하는 경우

 

그림 3-1

 

댓글이 존재하지 않는 경우

 

그림 2-2

 

 

REFERENCE

•  

 

 

DATE

• 2020.01.10