Programming/jQuery

[jQuery] Ajax 전송

성일만 2014. 8. 14. 10:49

Ajax 전송



Ajax

Asynchronous JavaScript and XML 의 약어. 웹서버와 비동기식 통신을 이용해 대화영 어플리케이션을 


구현하는 기법


Parameter

type : GET or POST

url : 전송하고자 하는 URL

data : 받는 곳의 방식에 따라 xml, json 등등의 데이터로 구성

contentType : 보낼 데이터 포맷 형식

dataType : 받을 데이터 포맷 형식

success or failure : 이 안에 있는 function(data)는 값을 받으면 알아서 data 변수에 받은 객체가 할당됨.


Use

function Send() {

$.ajax({

type: "POST",

url: "",

data: "",

//contentType: "application/json; charset=utf-8",

dataType: "json",

success: function (data) {

alert(data.RETCODE);

},

failure: function (data) {

alert('Fail');

}

});

}



응용

POST

function getAjaxPost(frmObj, successCallbackFunction, actionURL, dataType) {

var formAction = actionURL;

var formName = "#" + frmObj.name;

var option = {

type : "POST"

, url : formAction

, dataType : dataType

, success : function(result) {

if(sessionResultCheck(dataType, result)){

successCallbackFunction(result);

}

}

, error : function(e) {

alert("처리중 장애가 발생하였습니다 .\n" + e );

}

, cashe : false

};

$(formName).ajaxSubmit(option);

}


GET

function getAjaxGet(successCallbackFunction, actionURL, dataType) {

// JQUERY AJAX 처리

$.ajax({

type: "GET",

dataType : dataType,

url: actionURL,

// 데이터를 받아왔을 경우

success: function (result){

if(sessionResultCheck(dataType, result)){

successCallbackFunction(result);

};

},

// 데이터를 못받아 왔을 경우

error : function(e) {alert("처리중 장애가 발생하였습니다.\n" + e ); }

, cache : false

});

}


GET (sync)

function getAjaxGetSync(successCallbackFunction, actionURL, dataType) {

// JQUERY AJAX include페이지 데이터 결과가 빠른순으로 보여지는 현상 안되게 처리

$.ajax({

type: "GET",

dataType : dataType,

url: actionURL,

async : false,

// 데이터를 받아왔을 경우

success: function (result){

if(sessionResultCheck(dataType, result)){

successCallbackFunction(result);

};

},

// 데이터를 못받아 왔을 경우

error : function(e) {alert("처리중 장애가 발생하였습니다.\n" + e ); }

, cache : false

});

}