2016-06-09 2 views
0

내가 jQuery를 사용하여 간단한 AJAXing을 실험하고있다. .php 페이지에 빈 데이터를 게시 한 다음 JSON 인코딩 된 데이터를 내 자바 스크립트가있는 페이지로 다시 보냅니다. 여기 jQuery를 - 아약스 POST 방식의 오류,

내가 작성한 코드는이 일을하지만,이 코드는 오류를 생산 왜 내가 알아낼 수 없습니다 동안 오류가 받고 있어요

..

의 index.php 크롬 콘솔에서

<form id="getData"> 
     <button name="control" type="submit" value="A">GET DATA</button> 
    </form> 

    <form id="showData"> 
     <button name="control" type="submit" value="A">SHOW DATA</button> 
    </form> 
    <div id="results"></div> 
    <div id="map"></div> 

    <script> 
    $("document").ready(function(){ 
     $("#getData").submit(function(event){ 

      $.ajax({ 
       url : "/getVehiclePosition.php", 
       type: "POST", 
       data: "", 
       success: function(data, textStatus, jqXHR) 
       { 
        //data - response from server 
        console.log("Hooray, it worked!"); 
        $('#results').append(data); 
       }, 
       error: function (jqXHR, textStatus, errorThrown) 
       { 
        console.error(
         "The following error occurred: "+ 
         textStatus, errorThrown 
        ); 
       } 
      }); 

     }); 
    }); 
    </script> 

, 나는 다음과 같은 오류를 받고 있어요 ..

The following error occurred: error 
error @ ?control=A:52 
i @ jquery-1.12.2.min.js:2 
fireWith @ jquery-1.12.2.min.js:2 
y @ jquery-1.12.2.min.js:4 
c @ jquery-1.12.2.min.js:4 
내가 양식 #getDATA에 바인딩 제출 꺼내 경우 어떤 이유 16,

, 그것은 순간에 내 머리를 잡아 당겨 .. 다시 잘 작동합니다, 도와주세요! 미리 감사드립니다.

[UPDATE] =========================================== 당신은 그것의 기본 작용에 의해 제출에서 양식을 멈추지 않았다

enter image description here

+0

개발자 도구 (F12)> 네트워크 및 필터 (XHR)를 참조하십시오. 그런 다음 버튼을 클릭 한 후 왼쪽에 빨간색 'getVehiclePosition.php'가 표시되어야합니다. –

답변

0

======================== 캡처 XHR, 그래서 당신은 아약스 요청을 구현할 수 있습니다. ajax 전에 event.preventDefault()를 사용하십시오.

+0

아,와, 네, 절대적으로 옳습니다! 어리석은 실수 ... 매력처럼 되네요, 고마워요! – lukieleetronic