AJAX 컨트롤 많이 있겠지만, Form 메소드 형태로 | |||
| |||
/****************************************************************************** * Description : 1. 기본 사용법 var ajax = new Ajax(); ajax.Method = 'POST'; ajax.Action = '/path/페이지'; ajax.addParam('키', '값'); ajax.onError = function(오류코드, 오류메세지){}; ajax.onComplete = function(데이터){처리} ajax.submit(); 2. 각 멤버 변수 - XMlHttp : XMLHttpRequest 객체 - Method : 전송방식[= 'POST', 'GET'] - Action : 서버 페이지 [ URL ] - Parameters : 전달 변수(배열) - 실제 직접 컨트롤할 작업이 없음 - DataType : 데이터 수신 방식[='Text', 'XML'] - Values : 사용자 정의 변수 선언을 위한 변수 3. 각 함수 - onLoad : 데이터 전송된 후 서버로 부터 데이터 전송이 완료되기 전까지 이벤트(함수객체) onLoad = 함수명 function 함수명(){ document.getElementById('msg').innerHTML = "데이터 전송 중..."; } - onComplete : 데이터 전송이 완료되는 순간 이벤트 발생(함수객체) onComplete = 함수명 fuction 함수(Text = [Text, XML]){ document.getElementById('msg').innerHTML = Text; } - onError : 오류가 발생했을 경우 처리하는 함수(함수객체 onError = 함수명 fuction 함수(errno = 숫자, error = 문자열){ alert(errno + " : " + error) } - addParam : 파라미터 입력 함수 addParam('name', 'ajax') - submit() : 데이터 전송 함수 * 해결 문제 : 멀티 쓰레드 -.-;;;; * ** * Last update : 2006. 5 * Copyright (c) 2006, By Lee N.THU * e-Mail : <support@x-wiz.com> * ******************************************************************************/ function xwzAjax(){ window.xwzXmlHttp = this; this.XmlHttp = null; this.Method = 'GET'; this.Parameters= new Array(0); this.Action = window.location.href; this.DataType = "Text"; this.onLoad = null; this.onComplete = null; this.onError = null; this.addParam = function(Name, Value){this.Parameters[Name] = Value;} this.getParam = function(Name){return this.Parameters[Name];} this.addValue = function(Name, Value){this.Values[Name] = Value;} this.getValue = function(Name){return this.Values[Name];} this.getStatus = function(){ var eventValue = this.XmlHttp.readyState; var Events = ['Uninitialized', 'Loading', 'Loaded', 'Interactive', 'Complete']; return Events[eventValue]; } this.submit = function(){ if(this.XmlHttp != null) this.XmlHttp = null; if(window.ActiveXObject){ try{this.XmlHttp = new ActiveXObject("Msxml2.XMLHTTP");}catch(e){try{this.XmlHttp = new ActiveXObject("Microsoft.XMLHTTP");}catch(e){} } }else if(window.XMLHttpRequest){ this.XmlHttp = new XMLHttpRequest(); } if(this.XmlHttp == null){ if(this.onError != null && typeof(this.onError) == "function") this.onError(1, "Not install."); return false; } var TYPE = "text/xml"; var URI = this.Action; var Entry = "", QUERY_STRING = ""; var QUERYS = new Array(0); for(var Name in this.Parameters){Entry=Name+"="+encodeURIComponent(this.Parameters[Name]);QUERYS.push(Entry);} QUERY_STRING = QUERYS.join("&"); if(this.Method.toUpperCase() == 'POST'){ TYPE = "application/x-www-form-urlencoded"; this.XmlHttp.open("POST",URI, true); }else{ if(URI.indexOf("?") === -1) URI += "?" + QUERY_STRING; else URI += "&" + QUERY_STRING; this.XmlHttp.open("GET",URI, true); QUERY_STRING = ""; } this.XmlHttp.setRequestHeader("Content-type", TYPE); this.XmlHttp.setRequestHeader("Cache-Control", "no-cache"); this.XmlHttp.setRequestHeader("Pragma", "no-cache"); this.XmlHttp.send(QUERY_STRING); this.XmlHttp.onreadystatechange = function(){ var oXmlHttp = xwzXmlHttp.XmlHttp; if(oXmlHttp.readyState == 4){ if(oXmlHttp.status == 200 && xwzXmlHttp.onComplete != null && typeof(xwzXmlHttp.onComplete) == "function"){ switch(xwzXmlHttp.DataType.toUpperCase()){ case "XML":window.xwzXmlHttp.onComplete(oXmlHttp.responseXML);break; default:window.xwzXmlHttp.onComplete(oXmlHttp.responseText);break; } }else{ if(xwzXmlHttp.onError != null && typeof(xwzXmlHttp.onError) == "function") xwzXmlHttp.onError(oXmlHttp.status, oXmlHttp.statusText); } }else if(xwzXmlHttp.onLoad != null && typeof(xwzXmlHttp.onLoad) == "function" ){ xwzXmlHttp.onLoad(oXmlHttp.readyState); } } } } Tags: JavaScript ajax | |||
| |||
| |||
로그인을 하시면 댓글을 등록 할 수 있습니다. |
SIMILAR POSTS JavaScript로 만든 달력(popup 객체사용) |
OTHER POSTS IN THE SAME CATEGORY 쿠키 세팅하기 |