240714 12주차 일요일 미니 프로젝트 쇼핑몰 제작 10

https://jaeano.tistory.com/entry/Javascript-Ajax-%EA%B0%9C%EB%85%90-%EC%82%AC%EC%9A%A9-%ED%9A%8C%EC%9B%90%EA%B0%80%EC%9E%85%EC%8B%9C-ID-%EC%A4%91%EB%B3%B5%EC%B2%B4%ED%81%AC

[Javascript] Ajax 개념, 사용 (회원가입시 ID 중복체크)

ajax 이용한 아이디 중복 체크

 

 

close함수

https://blog.naver.com/PostView.nhn?blogId=innoc99&logNo=140055334056

JavaScript에서 close()함수를 사용하자! 총정리!

 

 

function checkID() { //중복아이디 체크
const element = document.getElementById('check');

let id = document.getElementById("id").value;
const httpRequest=new XMLHttpRequest();



httpRequest.onreadystatechange=function(){
if(httpRequest.readyState==4 && httpRequest.status==200){
const response=httpRequest.responseText;
console.log(response);
let str="";
if(response=="true"){
str="중복되었습니다";
}else{
str="사용가능합니다.";
}
element.innerText = '입력한 아이디는 '+str;
}else{
console.log("나쁜");
}
};

httpRequest.open("GET",'/jdbc07_shoppingmall/user/join_pro.user?user_id='+id,true);
httpRequest.responseType="text";
httpRequest.send(null);

}

 

중복체크 버튼 밑에 <div id="check"></div> 추가

 

컨트롤러 서블릿

}else if(command.equals("/user/join_pro.user")) {
String id=request.getParameter("user_id");
if(customerService.selectID(id).equals(id)){
System.out.println(id);
response.getWriter().print("true");
}else {
response.getWriter().print("false");
}
return;

 

리턴없으면 밑에 줄이 실행돼서 리턴있어야함