[ajax] 데이터 통신 html 설문 폼 json, ajax... 서버로 넘기기

========기존

 

	$.ajax({
               url: "데이터를 보낼 서버파일",
               type: "post",
               dataType: "json",
               data: {
		 e_view : e_view,
                  e_name: e_name,
                  e_tel: e_tel,
                  e_email: e_email,
		 e_indlaw : e_indlaw,
         	 e_agree : e_agree,
                  e_market : e_market,
                  is_mobile: "m"
               },
               success: function (data) {
                  if (data.result == "ok") {
                     //성공일때 실행하는 코드(ex: 완료 팝업을 연다. 폼을 리셋한다)
                  }else if(data.result=="duplicate"){
                     //정보가 duplicate일대 실행되는 코드(ex: 중복되었다고 경고창을 날린다)
                  }else{					  
                     //그외 확인하기 위해 데이터를 뿌린다
                  }
               },
               error: function (request, status, error) {
                  //어떤 곳에서 에러가 났는지 체크하기 위해 만든 콘솔과 경고창
                  console.log(request.responseText);
                  alert("code---:" + request.status + "\n" + "message:" + request.responseText +
                     "\n" + "error:" + error);
               }
            });

ajax에서 해당 url로 데이터 타입 json형태로 date를 보낼때, 전달할 data의 값을 "파라미터명: 값"으로 사용자가 설정해서 보낼수도 있지만!, 어짜피 form input의 name 값은 각자 고유한 값으로 설정을 하기 때문에 있는 속성값을 그대로 활용할 수 있는 jQuery 메소드가 있다고 하여 찾아보았다.

 

 

 

 

 

 

========개선

 

<form> 으로 부터 받아온 정보를 이용하여, jQuery에서 편리하게 데이터를 받아오는 .serialize() 메소드가 있다. 

해당 메소드를 이용하여, 정보를 객체로 담아 넘겨주고, 그 넘겨받은 값을 변수에 담아 서버로 전달해주면 된다.

 

	var str = $("#form1").serialize();
    
	$.ajax({
               url: "데이터를 보낼 서버파일",
               type: "post",
               dataType: "json",
               data: str,
               success: function (data) {
                  if (data.result == "ok") {
                     //성공일때 실행하는 코드(ex: 완료 팝업을 연다. 폼을 리셋한다)
                  }else if(data.result=="duplicate"){
                     //정보가 duplicate일대 실행되는 코드(ex: 중복되었다고 경고창을 날린다)
                  }else{					  
                     //그외 확인하기 위해 데이터를 뿌린다
                  }
               },
               error: function (request, status, error) {
                  //어떤 곳에서 에러가 났는지 체크하기 위해 만든 콘솔과 경고창
                  console.log(request.responseText);
                  alert("code---:" + request.status + "\n" + "message:" + request.responseText +
                     "\n" + "error:" + error);
               }
            });

 

요로코롬 치면 str에 담긴 정보는

 

single=Single&multiple=Multiple&multiple=Multiple3&check=check2&radio=radio1

 

이렇게 나온다.

&로 입력받은 정보를 구분하고

파라미터(인자) 값은 input 할때 name속성 값이 파라미터 값(이름)이 된다.

= 옆에는 입력받은 정보값이 들어오게 된다.

 

 

 

 

 

 

 

 

 

 

출처/참고자료

https://api.jquery.com/serialize/