본문 바로가기

Backend/AJAX

ajax 기초 개념 및 사용법

jQuery의 ajax : 파라미터들을 오브젝트 형식으로 받음

 

type : http method (get/post)

url : 데이터를 받아올 페이지 (입력한 url 경로의 파일(url 매핑 이름)로부터 요청한 데이터를 불러옴)

data : 요청 시에 함께 보낼 파라미터들 {"id": $('#user_id').val(), "pw": $('#user_pw').val()}

                                                     /* 컨트롤러에서 받을 때 : id, pw로 받음*/)

dataType : 받아올 데이터의 형식 (생략 가능) (html, json, xml, text 등 가능)

success : 성공 시에 수행할 핸들러

errer : 실패 시에 수행할 핸들러

 

serialize()

  • 폼에 입력된 값을 쿼리 스트링 방식의 데이터로 변환하여 액션 페이지에 전송
  • ex) ‘id=abcd&pass=1234…’

 

$.ajax({
	url:"전송되는 요청 url 매핑 이름",
    type :"데이터 전송 방식",
    data:"전송할 데이터",
    dataType:"요청하는 데이터의 타입",
    success:function(result){
    	전송 및 요청 성공 시 실행할 내용
        서버로부터의 응답 값(controller로부터 return된 값)을 result로 받음
    },
    error:function() {
    	오류 발생 시 실행할 내용
    },
    complete:function() {
    	전송 및 요청 완료 시 실행할 내용
    }
});

'Backend > AJAX' 카테고리의 다른 글

@RestController 이용한 REST 기능 구현  (0) 2022.01.12
Ajax (Asynchronous JavaScript and XML)  (0) 2022.01.11
Synchronous(동기식) / Asynchronous(비동기식) 통신  (0) 2022.01.11
REST  (0) 2022.01.11