AJAX 정리

 $(document).ready(function(){

         

         

        $.ajax({

             

            type : "GET",

            url : "ajaxData.jsp?type=1",

            dataType : "text",

            error : function(){

                alert('통신실패!!');

            },

            success : function(data){

                alert("통신데이터 값 : " + data) ;

                $("#dataArea").html(data) ;

            }

             

        });

         

 

    });

위의 예제는 ajax 통신을 할때 가장 기본이 되는 항목만 사용하였다. 적어도 위의 설정값 정도는 최소한으로 넣어주는게 좋다.

속성	설명
type	http 전송 method를 지정한다. GET, POST
url	호출 URL. GET 방식일경우 URL 뒤에 파라미터를 붙여서 사용해도 된다.
dataType	Ajax를 통해 호출한 페이지의 Return 형식이다. 형식에 따라 xml, json, html, text 등을 사용하면 된다.
error	에러났을때의 처리 부분이다.
success	성공했을때의 처리 부분이다. 보통 해당 부분에서 데이터 핸들링을 하면 된다.

.load()

HTML(을)를 읽어들여, DOM에 삽입 한다.

jQuery( selector ).load( url [, data ] [, complete ] )

• selector: 응답된 결과를 삽입할 요소. 여는 태그와 닫는 태그가 쌍으로 존재하는 요소를 선택해야 정상 작동 한다. (div, span 같은...)
• url: 서버 URL
• data: request로 전달할 데이터
• complete: 요청 완료 후 수행할 콜백 함수

$('#success').load('demo.jsp', function(response, status, xhr) {
     if (status == 'error') {
         alert(xhr.status + ' ' + xhr.statusText);
     }
});
 
$('#success').load('demo.jsp', { "choices[]": ["han", "lee"] } );
 
$('#success').load('demo.jsp', {limit: 25}, function(){
      alert('Test~!');
});

ex) 

$.ajax({      

       type:"POST",  

       url:"/jsp/include/oneajax.jsp",   

       data: $("#frm").serialize(),

       dataType:"json",

       success:function(data){   

        

           $("#top_companyCode option:eq(0)").val(data.date).attr("selected", "true");

        

           $("#top_examMasterCode option:eq(0)").val(data.date2).attr("selected", "true");

           if(index == 1){

           $("#top_examDetailCode option:eq(0)").val(data.date3).attr("selected", "true");

           }

        

           $("#top_examGubun option:eq(0)").val(data.date4_1).attr("selected", "true");

        

           

           $("#frm").attr({"action": "" , "target":"_self"}).submit();

       },   

       error:function(e){  

           alert(e.responseText);  

       }  

   });  

http://noritersand.tistory.com/216

http://rocabilly.tistory.com/27