准备SQL-AJAX返回数据

Question

I need some help setting up DB marker retrieval. I got a bit confused on what exactly to pass back. Here is what I have so far:

data returned:

["Chatswood NSW AU","Chippendale NSW AU"]

JS:

var opdata = [];
    function markers() {
            $.post("id.php", {id: <?php echo $id; ?>})
            .done(function(data) {
                //data is array returned
                opdata = data; //Tried this
                $(opdata) = data; //Tried this
                opdata.push(data); //Tried this
                $.each(data, function(i) { //Tried this
                    opdata.push(data[i]);
                });
            });
            console.log(opdata); //Shows [] empty array regardless what i do
        }

PHP:

$arr = array();
while (  $selectData -> fetch() ) {
    $arr[] = $address;
}
echo json_encode($arr);

How do I go about retrieving data? None of the above is working.

This is driving me nuts.. should i just $.ajax instead?

Answer 1

The call to .done is asynchronous, meaning that .done finishes right away, BEFORE the ajax call is made, and console.log is called right after, even if the http call is not finished yet.

Based on your use case and context you can choose between 3 options to return opdata back to the caller function:

///// OPTION 1: synchronous call
function markersUsingSynchronousCallToAjax() {
    var opdata = [];
    $.ajax({
        type: "POST",
        url: "id.php",
        async: false, // disable asynchronous call to ajax
        data: {id: <?php echo $id; ?>},
        success: function(data) {
            opdata = data;
        }
    })
    return opdata;
}
var opdata = markersUsingSynchronousCallToAjax();
console.log("using a synchronous ajax call", opdata);


///// OPTION 2: callback 
function markersUsingCallback(callback) {
    $.post("id.php", {id: <?php echo $id; ?>})
    .done(function(data) {
        callback(data);
    });
}
markersUsingCallback(function(opdata){
    console.log("using a callback", opdata);
});



///// OPTION 3: promise 
function markersUsingPromise(callback) {
    return $.post("id.php", {id: <?php echo $id; ?>});
}
markersUsingPromise().done(function(opdata){
    console.log("using a promise", opdata);
});