09.21(아이디 중복 검사)

JSP

<!-- 아이디 중복 확인 결과가 표시될 공간 -->
<div id="id_check"></div>

 

 

Ajax

//중복체크
$(document).ready(function(){
	//userId라는 input 태그 안에 아이디를 입력하고 focus가 다른 곳에 갔을때 실행됨
    //blur는 focus on의 반대개념(#userId에서 focus가 벗어나면 실행됨)
	$("#userId").blur(function(){
		
		let memberId = $("#userId").val();
		$.ajax({
			url : "<%= request.getContextPath() %>/member/checkIdDuplicate",
			method: "GET", 
			data: {"memberId": memberId}, 
			success: function(data){
				if(data=="notUsable"){
					// 아이디 중복 시 문구
					$("#id_check").text("사용 불가");
					$("#id_check").css("color", "red");
					$("#submit").attr("disabled", true);
				}else if(memberId.length!=0&&data=="usable"){
					$("#id_check").text("사용가능");
					$("#id_check").css("color", "blue");
				}
			}, error : function() {
					console.log("실패");
			}
		});
	});
})

 

 

Servlet

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	//1. 인코딩시작
	request.setCharacterEncoding("utf-8");

	//2. 사용자 입력값 처리
	String memberId = request.getParameter("memberId");

	//3. 업무로직
	Member m  = new MemberService().selectOne(memberId);
	boolean isIdUsable = m == null ? true : false;

	if(isIdUsable) {
		response.getWriter().print("usable");
	}else {
		response.getWriter().print("notUsable");
	}
}

 

 

이후 Service - dao - db