<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> <script type="text/javascript"> var xhr; function createXhr(){ if(window.ActiveXObject){//IE6 예전버전이라면 xhr = new ActiveXObject("Microsoft.XMLHTTP"); }else{ xhr = new XMLHttpRequest(); } } function idCheck(){ var id = document.getElementById("id").value; var queryString;
if(id.length<6){ document.getElementById("idcheckLayer").innerHTML = "ID는 6자리 이상 넣으세요."; return; } queryString ="command=idcheck&id="+id; //1.xhr 생성 createXhr(); //2. callback함수 등록 xhr.onreadystatechange = checkId; //3.open() xhr.open("POST","/javascript_ajax_class/AjaxServlet",true); //4.Post방식 설정 xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded;charset=utf-8"); //5.send() xhr.send(queryString);
} function checkId(){ //서버로부터 응답이 왔다면 일한다. if(xhr.readyState==4){//응답을 다 받은 경우 if(xhr.status==200){//응답코드가 200인 경우 - OK var resTxt = xhr.responseText;//서버가 보낸 응답 // alert(resTxt); document.getElementById("idcheckLayer").innerHTML = resTxt; }else{ alert("요청처리가 정상적으로 안되었습니다.\n"+xhr.status); } } } </script> </head> <body> ID : <input type="text" name="id" id="id" onkeyup="idCheck()"> <span id="idcheckLayer"></span> </body> </html>
if(command.equals("getHello")){ getHello(request,response); }else if(command.equals("postHello")){ postHello(request,response); }else if(command.equals("idcheck")){ idcheck(request,response); } } //ID 중복검사 처리 protected void idcheck(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { ArrayList<String> ids = new ArrayList<String>(); ids.add("aaaaaaa"); ids.add("bbbbbbb"); ids.add("bbbbbb"); ids.add("ccccccc"); String id = request.getParameter("id"); String message = null; if(ids.contains(id)){ message = "<font size=2 color=red>미이 등록된 ID입니다.</font>"; } else{ message = "<font size=2 color=green>사용할 수 있는 ID입니다.</font>"; } //응답 메세지1 : 사용할 수 있는 ID 입니다. //응답 메세지2 : 이미 등록된 ID입니다. response.setContentType("text/html;charset=utf-8"); response.setHeader("Cache-control", "no-cache");//cache를 사용하지 않겠다. 새로운 값이 나오게 한다. PrintWriter out = response.getWriter(); out.println(message); } protected void postHello(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String lang = request.getParameter("lang"); String name = request.getParameter("name"); String str = null; System.out.println("lang : "+lang); if(lang.equals("kor")){ str = "<font color=green>"+name+"님 안녕하세요 반갑습니다.</font>"; }else if(lang.equals("eng")){ str = "<font color=green>"+name+" hello, nice to meet you!</font>"; }else{ str = lang+"은 알수없는 언어 입니다."; } response.setContentType("text/html;charset=utf-8"); response.setHeader("Cache-control", "no-cache");//cache를 사용하지 않겠다. 새로운 값이 나오게 한다. PrintWriter out = response.getWriter(); out.println(str);
}
//getHello.html에서의 요청처리 protected void getHello(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=utf-8"); response.setHeader("Cache-control", "no-cache");//cache를 사용하지 않겠다. 새로운 값이 나오게 한다. PrintWriter out = response.getWriter(); int j = (int)(Math.random()*100); out.println("<font color=green>안녕하세요 반갑습니다."+j+"</font>"); } }