Javascript Function With JQuery POST Always Returns undefined

Question

I have no idea what's going on here and was hoping someone could help, I'm sure it's something easy going on that I'm just missing.

I have a function in javascript that has a JQuery post inside of it. I would like to return the results of the post which is just text and put it in a variable. The number is coming back correctly from the Post but when I put it in the variable, the variable says "undefined". Any ideas?

var total = GetTotalSize();
alert(total);

function GetTotalSize(){
    var i = "";
    $.post("Handlers/GetTotal.ashx", {id : $("#hID").val()}, function(data){
        i = data.toString();
        return i;
    });
}

Peter Bailey · Accepted Answer · 2009-09-09 17:10:14Z

6

You can't do it like that. Remember, the "A" in AJAX means "Asynchronous". The callback function you provide to $.post() will execute well after GetTotalSize() executes and returns.

You'll need to restructure your code to accommodate this. I can't be specific in my recommendation because I don't know what the rest of your code looks like, but here's a possibility.

$.post("Handlers/GetTotal.ashx", {id : $("#hID").val()}, function(data)
{
  doSomethingWithTotalSize( data.toString() );
});

function doSomethingWithTotalSize( totalSize )
{
  // whatever
}

answered Sep 9, 2009 at 17:10

Peter Bailey

106k32 gold badges186 silver badges206 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Wes Baker · Accepted Answer · 2010-03-23 16:12:16Z

2

Peter is absolutely right, but you can force the $.ajax method to work synchronously by passing async: false.

answered Mar 23, 2010 at 16:12

Wes Baker

1,5191 gold badge10 silver badges8 bronze badges

Comments

TJ L · Accepted Answer · 2009-09-09 17:07:21Z

1

The problem is that you are returning i outside of the callback function. Basically when you return i, its contents don't exist yet, and won't exist until the server returns the data to your callback function.

answered Sep 9, 2009 at 17:07

TJ L

24.5k7 gold badges63 silver badges78 bronze badges

1 Comment

Jon Over a year ago

Thanks for such a quick response! I tried your suggestion and updated my example code but I am still having the same problem, any other ideas?

Ivan Zavalnîi · Accepted Answer · 2012-08-15 21:14:01Z

1

Try this

function GetTotalSize(callback) {    
  $.post("Handlers/GetTotal.ashx", {id : $("#hID").val()}, function(outputData) {
       callback(outputData);
    });
}

function DoSomething(data)
{
   //....
}

GetTotalSize(DoSomething);

edited Aug 15, 2012 at 21:14

answered Aug 15, 2012 at 8:30

Ivan Zavalnîi

112 bronze badges

Comments

Prasad Jadhav · Accepted Answer · 2012-10-26 06:16:30Z

0

I realize this is an older post, but a solution for me was to use complete:[delegate] rather than success. This ensures that the callback is complete.

edited Oct 26, 2012 at 6:16

Prasad Jadhav

5,27416 gold badges65 silver badges81 bronze badges

answered Apr 10, 2012 at 18:38

Matt

1

Collectives™ on Stack Overflow

Javascript Function With JQuery POST Always Returns undefined

5 Answers 5

Comments

Comments

1 Comment

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related