Jquery JSON 응답 받기

Question

php jquery/json/ajax에서 응답을받는 데 문제가 있습니다. 나는이 모든 다른 튜토리얼을 결합하여 유지하고 있지만, 나는 아무 것도 배우지 않은 튜토리얼을 따라갈 수 없다.

지금 당장 나는 jquery ajax 함수에 연관 배열을 전달하는 쉬운 방법이 없으므로 두 개의 배열을 전달하려고 시도하고있다. 여기에 내 코드입니다 :

PHP

$names = array('john doe', 'jane doe'); 
$ids = array('123', '223'); 

$data['names'] = $names; 
$data['ids'] = $ids; 

echo json_encode($data); 

jQuery를 내 html 파일에서

function getList(){ 
    $.ajax({ 
     type: "GET", 
     url: 'test.php', 
     data: "", 
     complete: function(data){ 
      var test = jQuery.parseJSON(data); 
      alert(test.names[0]); 
      alert("here"); 
     } 
    }, 
     "json"); 
} 
getList(); 

정말 전화 했어 모든 디버깅 목적으로 내 자바 스크립트 파일입니다. 나는 객체를 반환하는 것을 알고 있지만 내 이름 섹션의 null 값에 오류가 발생합니다. 이유는 확실하지 않습니다. 내가 뭘 놓치고 있니? 그것은 Uncaught TypeError: Cannot read property '0' of undefined 나의 sub0이 나를 죽이고 여기 끝나는 것 같다

{"names":["john doe","jane doe"],"ids":["123","223"]} 

내 PHP 파일을 반환합니다.

Answer 1

당신은 표준 JSON 요청에 필요한 모든 아약스 PARAMS jQuery를 제공하는 $.getJSON 외관이 의지 설정을 사용 prob는 수 :

$.getJSON('test.php', function(response) { 
    alert(response.names[0]); // john doe 
}); 

그러나 나는 문제의 경로가 생각을 1) 서버가 올바른 응답 코드 및/또는 올바른 헤더 (예 : JSON 데이터)를 반환하지 않을 수 있습니다. 그러나 위의 방법은 적어도 후자의 경우이 결론을 강제해야합니다.

은 참조 : http://api.jquery.com/jQuery.getJSON

Answer 2

단일 개체에서 ajax() 함수의 모든 매개 변수를 전달해야합니다. 따라서 "dataType"옵션이 있어야합니다. 또한 데이터 유형을 명시 적으로 설정하면 jQuery가 JSON 데이터를 구문 분석합니다. 완전한 콜백은 구문 분석 된 JavaScript 객체를 매개 변수로받습니다. 그것은 문제처럼 보인다

function getList() { 
    $.ajax({ 
     type: "GET", 
     url: 'test.php', 
     data: "", 
     dataType: "json", 
     success: function(test) { 
      alert(test.names[0]); 
      alert("here"); 
     } 
    }); 
} 

Answer 3

당신이 대신 성공 콜백의 전체 콜백을 사용하고 있다는 것입니다 :

function getList(){ 
    $.ajax({ 
     type: "GET", 
     url: 'test.php', 
     data: "", 
     success: function(data) { /* success callback */ 
      var test = jQuery.parseJSON(data); 
      alert(test.names[0]); 
      alert("here"); 
     } 
    }, 
    "json"); 
} 
getList(); 

jQuery AJAX에서 문서 :

성공 (데이터, textStatus, jqXHR)

요청이 성공하면 호출 할 함수. 이 함수는 세 개의 인수를 전달받습니다. dataType 매개 변수에 따라 형식이 지정된 서버에서 반환 된 데이터. 상태를 설명하는 문자열. 및 jqXHR (jQuery 1.4.x, XMLHttpRequest에서) 객체. jQuery 1.5부터 성공 설정은 일련의 함수를 수용 할 수 있습니다. 각 함수가 순서대로 호출됩니다. 이것은 Ajax 이벤트입니다. 완전한

(jqXHR, textStatus)

함수

이 요청이 완료 (성공 오류 후 콜백이 실행될) 때 호출된다. 이 함수는 두 개의 인수, 즉 jqXHR (jQuery 1.4.x, XMLHTTPRequest) 객체와 요청의 상태를 분류하는 문자열 ("성공", "변경되지 않음", "오류", "시간 초과", "중단"또는 "parsererror"). jQuery 1.5부터 완전한 설정은 일련의 함수를 수용 할 수 있습니다. 각 함수가 순서대로 호출됩니다. 이것은 Ajax 이벤트입니다.

Answer 4

jQuery는 어떤 종류의 데이터가 응답으로 기대되는지 알고 싶어합니다. 그렇지 않으면 구문 분석 방법을 알지 못합니다.

여기에서 이전에 말했듯이 dataType = 'json' 속성을 사용하여 jQuery에 알립니다.

function getList() { 
    $.ajax({ 
     type: "GET", 
     url: 'test.php', 
     data: "", 
     dataType: "json", 
     success: function(data) { 
      console.log(data); 
     } 
    }); 
} 

이 외에도 PHP는 html보다는 json으로 콘텐츠를 제공하는 것이 좋습니다. PHP 스크립트의 출력 전에 header('Content-type: application/json');을 설정하여 헤더를 사용합니다. 그래서 :

$names = array('john doe', 'jane doe'); 
$ids = array('123', '223'); 

$data['names'] = $names; 
$data['ids'] = $ids; 

header('Content-type: application/json'); 

echo json_encode($data);