본문 바로가기

javaScript

ajax의 간단한 사용법

오랜만에 제이쿼리를 조금 사용해 보면서 ajax를 사용할 일이 생겼습니다

간단하게 ajax 비동기통신을 통해 데이터를 바인딩할 수 있는 방법을 알아보겠습니다

 

ajax란?

AJAX란, JavaScript의 라이브러리 중 하나이며 Asynchronous Javascript And Xml(비동기식 자바스크립트와 xml)의 약자입니다

전체 페이지를 새로 고침 하지 않아도 페이지 일부만을 로드하는 기법이며 javascript를 이용한 비동기 통신, 클라이언트와 서버 간의 XML데이터를 주고받습니다쉽게 말하자면 ajax는 서버에 데이터를 요청하는 것입니다.

 

$.ajax({
    type : 'post',           // 타입 (get, post, put 등등)
    url : '/test',           // 요청할 서버url
    async : true,            // 비동기화 여부 (default : true)
    headers : {              // Http header
      "Content-Type" : "application/json",
      "X-HTTP-Method-Override" : "POST"
    },
    dataType : 'text',       // 데이터 타입 (html, xml, json, text 등등)
    data : JSON.stringify({  // 보낼 데이터 (Object , String, Array)
      "no" : no,
      "name" : name,
      "nick" : nick
    }),
    success : function(result) { // 결과 성공 콜백함수
        console.log(result);
    },
    error : function(request, status, error) { // 결과 에러 콜백함수
        console.log(error)
    }
})

[참고] https://99geo.tistory.com/65