jquery / ajax 아작스 통신
2016. 1. 5. 14:00ㆍlanguage/jquery
jquery를 이용한 ajax 통신 예제입니다.
먼저 ajax가 무엇인지 궁금하신 분은 구글링하세요.
쉽게 설명하면 비동기 방식의 통신입니다.
산에서 사람이 "야호1" 이라고 소리를 보낼 때 반대편에서 "야호1" 이라고
메아리가 돌아올 때 까지 기다렸다가 "야호2"를 보내는 것이 동기 방식이고,
비동기 방식은 반대편에서 "야호1" 이이라고 메아리가 돌아오는것을 기다리지 않고
"야호2" "야호3"을 계속 보낼 수 있는게 비동기 방식입니다.
비동기 방식의 돌아오는 순서는 당연히 보낸 순서("야호1" "야호2" "야호3")가 아닙니다.
아래는 Jquery로 ajax를 구현한 소스입니다.
$
.ajax({
type : "POST" //"POST", "GET"
,
async : true //true(비동기화), false(동기화)
,
url : "" //Request URL
,
dataType : "json" //전송받을 데이터의 타입
//"xml", "html", "script", "json" 등 지정 가능
//미지정시 자동 판단
,
timeout : 30000 //제한시간 지정
,
cache : false //true, false
,
data : {itecd:itecd, operyy:operyy, opermmly:opermmly}
// data : $("#Form").serialize()
,
contentType : "application/x-www-form-urlencoded;charset=UTF-8"
,
success : function(result) {
//통신 성공시 처리
}
,
error : function(request, status, error) {
//통신 에러 발생시 처리
alert("code : " + request.status + "\r\nmessage : " + request.reponseText);
}
,
beforeSend: function() {
//통신을 시작할때 처리
$('#ajax_indicator').show().fadeIn('fast');
}
,
complete: function() {
//통신이 완료된 후 처리
$('#ajax_indicator').fadeOut();
}
});
|
cs |
도움이 되셨다면 공감을 부탁드립니다. ^^
'language > jquery' 카테고리의 다른 글
jquery / input file tag / 파일명 / file name 구하기 (0) | 2016.01.05 |
---|---|
jqgrid / resize / 그리드 사이즈를 화면 창에 따라 유동적으로 변경 (0) | 2016.01.05 |
jqgrid / 컬럼 show / hide / checked box / 컬럼 표시, 숨기기 (0) | 2016.01.05 |
jquery / selectBox plugins / 플러그인 모음 (0) | 2016.01.05 |
jquery / jqGrid / custom pager / custom paging / 그리드 / 페이징 (10) | 2016.01.05 |
jquery / 각종 다이어그램 플러그인 / 차트 / 관계 플러그인 (0) | 2016.01.05 |
jquery / 벨리데이션 체크 / validator / 자동 입력 제한 (0) | 2016.01.05 |
jquery / 강제 click 이벤트 발생 (0) | 2016.01.05 |
jquery / email / mail / input mail setting / 메일 / 이메일 셋팅 (0) | 2016.01.05 |
jquery selector / jquery 선택자 / 자주 사용하는 jquery selector 선택자 / selecter (0) | 2016.01.05 |