2012-08-07 2 views
1

유용한 데이터를 반환하지 않습니다JQuery와 아약스는이 말한다 내 파일에 JQuery와 스크립트가

이 말한다

<script type="text/javascript"> 
$(document).ready(function(e){ 
    $('#myButton').click(function(e){ 
     var formdata = {name: 'Alan', hobby: 'boxing'}; 
     var submiturl = 'http://localhost/cake/gronsters/testJSON/'; 
     $.ajax({ 
      type: "POST", 
      url: submiturl, 
      data: formdata, 
      success: function(message){ 
       console.log(message); 
      } 
     }); 
     e.preventDefault(); 
    }) 
}); 
다음

내가 testJSON에서 PHP 스크립트를

public function testJSON(){ 
    $name = $this->request->data['name'] . '-Sue'; 
    $hobby = $this->request->data['hobby'] . ' for donuts'; 
    $data = array( 'name' => $name, 'hobby' => $hobby); 
    echo json_encode($data); 
} 

console.log에서 message를 찾을 곳은 { "name": "Alan-Sue", "hobby": "boxing for doughnuts"}입니다. 내 웹 페이지의. console.log (message.name)를 사용하면 'undefined'라고 표시됩니다.

여기 무슨 일 이니?

+0

$.post는 testJSON에서 모든 코드인가? –

+0

ajax 호출을 설정할 때 "dataType : 'json'"을 설정하는 것이 좋습니다. 나는 jQuery가 유형에 지능적인 추측을 가지고 있지만 누가 그것을 알고 있는지, 아마도 잘못하고있는 것일 수도 있습니다. – Gromer

+0

예, 그게 전부예요. 내 케이크 PHP 응용 프로그램의 컨트롤러에있는 기능 일뿐입니다. –

답변

2

다른 언급이 있지만, 당신은 오른쪽 경로에있어, 보인다 .. 에코 문 뒤에 PHP 스크립트의 종료를하고 확인 귀하의 웹 사이트에 대한 JSON 문자열을 표시 한 후 귀하의 웹 페이지의 내용을 포함하고 있습니다. jQuery/JavaScript는 응답에 임의의 텍스트 또는 문자가 있으면 JSON을 구문 분석 할 수 없습니다. 당신은 당신이 JQuery와 JSON으로 응답을 구문 분석되어 있는지 확인하는 것이 좋습니다 ... 다음의 예와 같이 JSON 후 exit; 또는 die();이 echo'ed되어 사용 또한

public function testJSON(){ 
    $name = $this->request->data['name'] . '-Sue'; 
    $hobby = $this->request->data['hobby'] . ' for donuts'; 
    $data = array( 'name' => $name, 'hobby' => $hobby); 
    // Will halt the script and echo the json-encoded data. 
    die(json_encode($data)); 
} 

해야합니다. 기본적으로 반환되는 데이터 유형을 지능적으로 추측하려고 시도하지만 항상 신뢰할 수있는 것은 아닙니다. 당신은

<script type="text/javascript"> 
$(document).ready(function(e){ 
    $('#myButton').click(function(e){ 
     // It is best practice to "preventDefault" before any code is executed. 
     // It will not cause the ajax call to halt. 
     e.preventDefault(); 
     var formdata = {name: 'Alan', hobby: 'boxing'}; 
     var submiturl = 'http://localhost/cake/gronsters/testJSON/'; 
     $.ajax({ 
      type: "POST", 
      url: submiturl, 
      data: formdata, 
      // This is the proper data type for JSON strings. 
      dataType: 'json', 
      success: function(message){ 
       // JSON is parsed into an object, so you cannot just output 
       // "message" as it will just show "[object Object]". 
       console.log(message.name); 
      } 
     }); 
    }); 
}); 
</script> 

내가 더 도움이 설명하는 코드의 일부 의견을 포함 시켰습니다 ... 다음 예에서와 같이 AJAX 호출에 dataType 옵션을 추가해야합니다. 다행히도 이것이 도움이 될 것입니다. 또한 오류 처리기 또는 다른 고급 옵션을 해당 기능에서 사용하려는 경우가 아니면 전체 $.ajax 기능을 사용할 필요가 없습니다. 또는 $.post을 사용하여 코드를 줄이고 코드가 적은 원래 예제와 동일하게 수행 할 수 있습니다.

<script type="text/javascript"> 
$(document).ready(function() { 
    $('#myButton').click(function(e){ 
     e.preventDefault(); 
     var formdata = {name: 'Alan', hobby: 'boxing'}; 
     var submiturl = 'http://localhost/cake/gronsters/testJSON/'; 

     $.post(submiturl, formdata, function(message) { 
      console.log(message.name); 
     }); 

    }); 
}); 
</script> 

추가 옵션 및 $.ajaxjQuery.ajax();
더 자세한 정보에 대한 사용 정보에 대한 jQuery.post();

+0

고마워요. 내 컴퓨터에서 돌아올 때 다시 시도해 보겠습니다. –

+0

감사합니다. –

+0

당신을 환영합니다 :) 도와 줘서 기뻐요! –

3

/testJSON/페이지가 공개 기능에 쓰여진 것 이상을 출력하는 것처럼 들립니다. mvc 나 어떤 종류의 프레임 워크를 사용하고 있다면, echo json_encode가 끝나면 즉시 종료하거나 죽어야합니다. 그렇지 않으면 페이지의 다른 부분이 여전히 렌더링됩니다.

+0

지금은 테스트 할 수 없지만 그게 옳은 것 같습니다. 나는 케이크 PHP를 사용하고 있습니다. –

0

message.name을 로깅하기 전에 message 변수를 json으로 구문 분석하십시오.

data = $.parseJSON(message); 
console.log(data.name); 

또한 당신이 MVC 프레임 워크를 사용하는 것처럼