모지리도 정리한다.

먼저 몸으로 배운 ajax 사용법에 대해..설명하고자 합니다.


간단하게 작성해야할 코드부분부터 소개하고 설명하겠어요.


==================jsp =====================


$("#id").click(function() {


$.ajax({

var test = $("#id").val();

type:"POST",

url:"onchang.do", //보내고자하는 servlet 매핑주소를 입력함

data:({"test ":test }),   //위에 선언한 변수 test의 데이터를 보냄

success: function(data) { //function안에 data값은 servlet에서 보내주는 변수명임

  if(data.trim() != "a") { //변수명이 "a"면 success를 타고 아니면 error로 설정

    return false;

},

error : function() {

        alert("data error");

    }

});
});


====================java==================

@RequestMapping("/test.do") 

public void onchang2(HttpServletRequest request,

HttpServletResponse response, Model model) throws Exception {

PrintWriter out = response.getWriter(); // ajax에서 데이터를 받고 다시 보낼수 있도록 선언

  String data="a";  //이제 여기 안에서 db값 불러오고 지지고 볶은 후, 

  out.println(data);  // 로직이끝나는 시점에서 data값을 전송함


그러면 위에 ajax에서 data="a" 이니까 , if문을 타고 로직을 수행함.


즉, id값을 찾아서 id값을 가진 데이터를 클릭 하게되면, ajax를 수행하다가 .do매핑주소로 들어간다. 그 동안 script는 멈춰있는상태가 되고, servlet로직을 수행하게된다. servlet로직을 수행후,

out(data)를 다시 ajax로 보내는데 여기서 data의 값을 비교 후, ajax에서 또 다른 수행을 하게된다.


모든 수행이 끝이 나면, id값을 클릭 했을 시, 필요한 이벤트처리를 쉽게 할 수 있다. 하지만 주의할 점은 .do를 최소한으로 만들어야 좋다. 왜냐하면 지극히 내생각이지만 db에서 query도 적게 만들 수 있고, 이벤트 실행할 때 마다 데이터를 보낼 때 시간이 오래 걸리는 것으로 기억한다.(몸으로..)


* $("#id).click(function(){}): → ajax → test.do → ajax → end



*부족한부분은 나중에 추가설명하겠습니다. 더 열공열공