CODEWITHSUNDEEP
javascriptjqueryhtml
TIMEX
TIMEX

Reputation: 271624

How do I return something in JQuery?

function vote_helper(content_id, thevote){
            var result = "";
            $.ajax({ 
                type:"POST",
                url:"/vote",
                data:{'thevote':thevote, 'content_id':content_id},
                beforeSend:function() {
                },
                success:function(html){
                       result = html;
                }
            });
            return result;
        };

I want to return the result. But it's returning blank string.

Upvotes: 0

Views: 193

Answers (4)

Ruan Mendes
Ruan Mendes

Reputation: 92274

If you want the UI to be completely unresponsive while waiting for the server's response, you could do the following:

function vote_helper(content_id, thevote){
        var result = "";
        $.ajax({ 
            type:"POST",
            async: false, //This line will make your code work
            url:"/vote",
            data:{'thevote':thevote, 'content_id':content_id},
            beforeSend:function() {
            },
            success:function(html){
                   result = html;
            }
        });
        return result;
};

But nobody wants the UI to hang, so the real answer is what other suggested, instead of returning a value, your method should take a callback that will be passed the 'return value' when your asynchronous method returns.

Upvotes: 0

David Tang
David Tang

Reputation: 93664

The ajax won't complete by the time your function ends, so you can't return a result. Instead you have to modify your function to accept a callback, and call that callback with the result:

function vote_helper(content_id, thevote, callback) { // extra callback argument
    $.ajax({ 
        type: "POST",
        url: "/vote",
        data: {'thevote':thevote, 'content_id':content_id},
        beforeSend: function() {},
        // Point directly to the callback here
        success: callback
    });
};

Upvotes: 1

Brad Christie
Brad Christie

Reputation: 101594

Short answer, you can't.

Long answer, .ajax uses a callback to return the value. This means that the value may or may not have been returned already by the time the return fires. But either way, it's being done so in another context.

If you're looking to make this simulate returning a value, add a new argument to your function that will replace the ajax callback. Something such as:

 function vote_helper(content_id, thevote, callback){
    var result = "";
    $.ajax({ 
        type:"POST",
        url:"/vote",
        data:{'thevote':thevote, 'content_id':content_id},
        beforeSend:function() {
        },
        success:callback
    });
    return result;
};

vote_helper(x,y,function(html){
  result = html;
});

But work-around or not, the reply will never be in the same working path as the code that calls the function. You need to await the response and pick up processing from there.

Upvotes: 2

Andrew Whitaker
Andrew Whitaker

Reputation: 126042

Since you're making an AJAX call, you need to process the result of the AJAX call in the success callback:

function vote_helper(content_id, thevote){
            $.ajax({ 
                type:"POST",
                url:"/vote",
                data:{'thevote':thevote, 'content_id':content_id},
                beforeSend:function() {
                },
                success:function(html){
                /* Do something like call a function with html */
                }
            });
        };

Upvotes: 1

Related Questions