.ajax()를 통해 PHP 스크립트에 데이터를 전달하는 올바른 방법은 무엇입니까?

Question

jQuery .ajax()를 통해 데이터를 보내려는 PHP 스크립트가 div 컨테이너에로드됩니다. 그러면 PHP 스크립트가이 데이터 조각으로 실행되고 해당 내용이 앞서 언급 한 div 컨테이너로 반환됩니다.

처음에는 클릭 할 때 올바른 요소를 추가했지만 count_bucket 변수가 PHP에 전달되지 않았으므로 정확하게 이름을 지정할 수없는이 코드를 작성했습니다 (아래 참조).

var count_bucket = 4; 
    var loadPHP = "create_new_bucket.php"; 
    $(".add_bucket").click(function(){ 
     count_bucket++; 
     $("#tree_container2").append($('<div id="bunch' + count_bucket + '">').load(loadPHP)); 
     return false; 
    }); 

그런 다음이 코드를 count_bucket 변수를 PHP 스크립트로 전달하려고 시도하여이 코드를 변경했습니다 (아래 참조).

var count_bucket = 4; 
$(".add_bucket").click(function() { 
    count_bucket++; 
    var bucket_add = $.ajax ({ 
     type: "GET", 
     url: "create_new_bucket.php", 
     data: var count_bucket, 
     dataType: "json", 
     async: false, 
    }).responseText; 
    $('#tree_container2').append($('<div id="bunch' + count_bucket + '">').load(bucket_add)); 
}); 

PHP의 파일 create_new_bucket.php은 다음과 같습니다

<?php 
    include_once "test_functions.php"; // include functions page 
    $i = $_GET["count_bucket"]; 
    drawBunchNew($i); 
?> 

내가 올바르지 않습니다 아약스의 어떤 측면() 분명 해요. PHP에서 변수를 올바르게 수집하지 못하거나 PHP 구문에 잘못된 구문을 사용하고 있습니다. 누구든지 오류를 식별하는 데 도움이 될 수 있다면 크게 감사하겠습니다.

*UPDATE* ** * **

감사 Tejs & Tandu. 지금 데이터를 구조화하는 방법은 분명하지만 jQuery 전체를 작동시키는 데는 여전히 문제가 있습니다. Tandu가 대신 .load()를 사용하고 POST를 사용하여 데이터를 가져 오도록 PHP를 변경했지만 여전히 올바르게 작동하지 않습니다.

var count_bucket = 4; 
$(".add_bucket").click(function() { 
    count_bucket++; 
    var bucket_add = $.load ("create_new_bucket.php", {count_bucket: count_bucket}, }).responseText; 
    $('#tree_container2').append($('<div id="bunch' + count_bucket + '">').load(bucket_add)); 
}); 

그리고 PHP는 : 내가 사용

<?php 
include_once "test_functions.php"; // include functions page 
$i = $_POST["count_bucket"]; 
drawBunchNew($i); 
?> 

최종 작업 JQuery와는 (최종 PHP는 위와 동일) :

var count_bucket = 4; 
    var loadPHP = "create_new_bucket.php"; 
    $(".add_bucket").click(function(){ 
    count_bucket++; 
    $("#tree_container2").append($('<div id="bunch' + count_bucket + '">').load(loadPHP, {count_bucket: count_bucket})); 
    return false; 
    }); 

Answer 1

아약스 요청의 데이터 속성에 가고 사물이다. 그것을 생각해 보라. JSON :

{ data: var response } 

유효하지 않은 JSON.

data: { myKey: 'myValue', myKey2: 'myValue2' } 

또는 상황에 : 그러나이 같은 것을 할 수

data: { count_bucket: 4 } 

을 그리고 그 이름 값 세트의 일부로 서버에 데이터 속성에 포함 된 데이터를 전송합니다.

Answer 2

jQuery의 ajax 데이터는 쿼리 문자열 형식의 문자열 ('key[]=value&key[]=value&key[]=value') 또는 json 개체 ({key: [value, value, value]})로 전달되어야합니다. var에는 구문 오류가 있다고 생각됩니다. 키를 지정해야하므로 data: {count_bucket: count_bucket} 또는 data: 'count_bucket=' + count_bucket 중 하나를 선택해야합니다.

.ajax()을 사용할 필요가 없습니다. 일반적으로 .load(), .post() 및 .get()을 사용하는 것이 더 편리합니다. 귀하의 경우, .load() 잘 작동합니다. 데이터를 두 번째 인수로 전달하십시오.

왜 요청을 비동기로하고 싶지 않습니까? dataType은 보내는 값이 아닌 반환 값의 데이터 형식입니다. 당신은 json을 받고 있습니까? jQuery는 또한 이것을 올바르게 추측 할 수 있으며, PHP 측에서 헤더를 설정하면 많은 도움이된다. GET 유형도 기본값입니다.

최종 참고 사항 : .load()을 사용하는 경우 데이터를 문자열로 전달하면 GET을 사용하지만 개체로 전달하면 POST가 사용됩니다.