머리가 뽀사질 것 같네요...ㅎㅎㅎ
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<html>
<head> <title>[two.jsp]</title>
<script type="text/javascript">
window.onload=function(){
//ajax는 자바,자바스크립트,jsp를 짬뽕시키기 때문에 사용하는데 좀 까다롭다.
//ID값으로 작업해야하기 때문에 getElementById("") 으로 ID를 가져온다.
//login_button을 클릭하면 requestSend 메소드를 실행한다.
document.getElementById("login_button").addEventListener('click',requestSend);
} ;
var request=null ;
// request 대신 XMLHttpRequest 객체 생성 : public으로 선언하여 어디에서든지 가져다 쓰도록 해준다.
if(window.ActiveXObject){
request = new ActiveXObject("Microsoft.XMLHTTP");
}else if(window.XMLHttpRequest){
request = new XMLHttpRequest( );
}
function requestSend(){
var loginId = document.getElementById("main_login_id").value; // 화면폼에서 I.D 의 id값인 main_login_id
var loginName = document.getElementById("main_login_name").value;
if(loginId=="" || loginName==""){
alert("empty ID, you can't empty this input area");
}else{
alert( loginId +" " + loginName ) ;
var url="login.do? "; //web.xml 문서에 정의 : src.mvc.SessionLogin.java 문서로 이동
var param= 'sabun=' + loginId + '&name=' + loginName;
/* 서버로부터 결과값이 도착할 때 값들을 처리해줄 함수를 지정해준다.
xhr.onreadystatechange = 함수 : 함수의()는 생략해준다. ;
xhr.open("get/post", "jsp/java문서지정=>url변수에 지정해줌.", true) ;
xhr.send( ) ; get일때 null, post일때는 값 설정(여기서는 param변수) */
request.onreadystatechange=callbackFund;
request.open('POST', url, true);
//request.seRequestHeader('Content-Type', 'application/x-www-form-urlencoder:charset=UTF-8'); =>생략가능
request.send(param);
}
}//end
function callbackFund(){ //서버로부터 전달되는 결과값이 도착하는 메소드
try{
if(request.readyState==4){ // 4일 경우 서버로부터 데이터처리가 완료되었음을 의미
if(request.status==200){ // 정상적인 처리가 완료되었다면,
var xmlTest = request.responseXML;
var login_res = xmlTest.getElementById('login')[0].childNodes[0].nodeValue;
}
}
}catch(e){ alert( "error:" + e.description); }
}//end
function check(){ alert("check() 함수" );
</script>
</head>
<body>
<h1> <font color=green> [ajax] </font> </h1>
<div id="login_div">
<form name="myform" method="get" action="login.do" >
I.D: <input type=text id="main_login_id" name="sabun" > <br>
Name: <input type=text id="main_login_name" name="name" > <br>
<input type="button" id="login_button" value="LOGIN" onClick="requestSend()">
<input type="reset" id="login_reset" value="RESET" >
</form>
</div>
</body>
</html>
************** 실행화면 **************************
