[JAVA] ajax를 활용한 모달창 즐겨찾기 기능 구현

1. view 페이지

모달창이 뜰 때마다 checkFavorite() 함수가 실행된다.

<script>
function checkFavorite(){ //즐겨찾기 여부를 체크하는 함수
	const no = $('.no').val();
	$.ajax({
		url: "mypage_favorite_check.do",
        type: "POST",
        data: {
            no: no
        },
        success: function (data) {
        	if(data == "existFavorite"){
        		$("#favoriteStar").attr("src", "resources/icon/star-fill.svg" );
        	}else{
        		$("#favoriteStar").attr("src", "resources/icon/star.svg" );
        	}
        },
	})
}

function makeFavorite(){ //즐겨찾기를 만들고 삭제하는 함수
	const no = $('.no').val();
	$.ajax({
		url: "mypage_favorite.do",
        type: "POST",
        data: {
            no: no
        },
        success: function (data) {
        	if(data=="loginFirst"){
        		alert("로그인을 해주세요.");
        	}else if(data=="add"){
        		alert("즐겨찾기에 추가되었습니다.")
        		checkFavorite();
        	}else if(data=="delete"){
        		alert("즐겨찾기가 해제되었습니다.")
        		checkFavorite();
        	}
        },
	})
	
}  
</script>

2. Controller

//즐겨찾기 등록, 삭제하는 메소드
@RequestMapping(value="/mypage_favorite.do", produces = "application/text; charset=utf8")
	@ResponseBody
	public String mypageFavorite(HttpServletRequest req,HttpSession session) {
		Map<String,Object> map=new HashMap<>(); 
		int tour_no = Integer.parseInt(req.getParameter("no"));
		
		// 로그인 안 되어있으면
		if(session.getAttribute("nowUserNo") == null) {
			return "loginFirst";
		}
		
		int no = (int) session.getAttribute("nowUserNo");
	    MyPageDTO pdto = mypageMapper.getMyPage(no);
		
		// 기존 즐겨찾기가 존재하면
		if(pdto.getMypage_favorite_tour() != null) {
			//즐겨찾기(tour)가져오기& ','별로 나눠서 배열에 담기
			String tour= pdto.getMypage_favorite_tour();
			String[] arr = tour.split(",");
			
			//현재 tour_no가 즐겨찾기 안에 있는지 검색
			for(String list_tno : arr) {
				int tno = Integer.parseInt(list_tno);
				
				if(tno == tour_no) { //즐겨찾기 해제
					String update_tour = tour.replace(String.valueOf(tour_no)+",", "");
					map.put("tour", update_tour);
				    map.put("no", no);
				    int res = mypageMapper.deleteFavorite(map);
				    
					return "delete";
					}
				}
			
		}
			// 즐겨찾기 리스트가 존재하지 않거나 tour_no가 즐겨찾기에 없다면
			map.put("tour_no", tour_no);
		    map.put("no", no);
			int res = mypageMapper.updateFavorite(map);
			return "add";
		
	}
	
	

	//즐겨찾기 여부 체크하는 메소드
	@RequestMapping("/mypage_favorite_check.do")
	@ResponseBody
	public String mypageFavoriteCheck(HttpServletRequest req,HttpSession session) {
		int tour_no = Integer.parseInt(req.getParameter("no"));
		int no = (int) session.getAttribute("nowUserNo");
		
		MyPageDTO pdto = mypageMapper.getMyPage(no);
		
		// 기존 즐겨찾기가 존재하면
		if(pdto.getMypage_favorite_tour() != null) {
			//즐겨찾기(tour)가져오기& ','별로 나눠서 배열에 담기
			String tour= pdto.getMypage_favorite_tour();
			String[] arr = tour.split(",");
			
			//현재 tour_no가 즐겨찾이 안에 있는지 검색
			for(String tno : arr) {
				int list_tno = Integer.parseInt(tno);
				if(list_tno == tour_no) { // 있으면
					return "existFavorite";
				}
			}
		}
		return null;
}