jQuery $.post returned data

Question

I'm having some issues on how to use the data returned by jQuery's $.post function. I'm trying to test if a picture exists on my server or not.

Here is the javascript :

$.post("ajax_test_file.php",
    {filename: filetocheck},
    function(data){
        if(data==1){
            var img_ref_up = 'value 1';
        }else{
            var img_ref_up = 'value 1';
        }
    }
);

[Following code trying to use img_ref_up's value]

And here is the ajax_test_file.php content :

$filename = $_POST["filename"];

if (file_exists($filename)) {
    echo 1;
} else {
    echo 0;
}

What i'm trying to do is to use the value of img_ref_up right after the $.post(...)

Does anyone have a clue about this? Thanks in advance

Thanks for everybody's help. I didn't pay attention to the asynchronous fact. So I've decided to use $.ajax instead and to run it in a synchronous way, and it works like a charm, I can use the result outside the callback function (I have no other choice) — user1071795, Nov 29 '11 at 18:09

score 1 · Answer 1 · answered Nov 29 '11 at 17:24

$.post is running asynchronously so it looks like you're accessing the value before the ajax request has finished. You could move your code into the success callback and that would assure that the value of image_ref_up is set before you use that variable.

$.post("ajax_test_file.php",
    {filename: filetocheck},
    function(data){
        if(data==1){
            var img_ref_up = 'value 1';
        }else{
            var img_ref_up = 'value 1';
        }
        // move your code here
    }
);

score 1 · Answer 2 · answered Nov 29 '11 at 17:24

You can not/should not - ajax calls are asynchronous (you can make it synchronous but it's highly discouraged). You have to process the result inside the callback method:

$.post("ajax_test_file.php",
    {filename: filetocheck},
    function(data){
        if(data==1){
            var img_ref_up = 'value 1';
        }else{
            var img_ref_up = 'value 1';
        }
        ///// DO WHATEVER YOU NEED HERE
        [Following code trying to use img_ref_up's value]
    }
);

score 1 · Answer 3 · answered Nov 29 '11 at 17:27

As the request is asynchronous the [Following code] section will likely be executed before the post has completed. You should do this instead.

$.post('url', function(data) {
    var img_ref_up;
    if (data == 1) {
        img_ref_up = 'value 1';
    }
    doSomethingWithRefUp(img_ref_up);
});

function doSomethingWithRefUp(img_ref_up) {
     [Following code]
}

jQuery $.post returned data

3 Answers3