jQuery ajax return value [duplicate]

Question

How can I return the value "pinNumber" from jquery ajax so I can append it outside of the ajax. Here is my code

var x = pinLast + 1;
    for(i=x;i<=pinMany;i++) {
        var i = x++;
        var cardNumber = i.toPrecision(8).split('.').reverse().join('');
        var pinNumber = '';

        jQuery.ajax({
            type: "POST",
            url: "data.php",
            data: "request_type=generator",
            async: false,
            success: function(msg){
                var pinNumber = msg;
                return pinNumber;
                //pin number should return
            }
        });

        jQuery('.pin_generated_table').append(cardNumber+' = '+pinNumber+'
');
        // the variable pinNumber should be able to go here

    }

Please ask me if you don't understand.. ^^ thanks

Yet another "how do I return data from an asynchronous function" question. This kind of question is asked all too often. Voting to close. — Jacob Relkin
– Jacob Relkin, Commented Feb 13, 2011 at 7:22
How dare you ask this question! I vote to remove this person from the earth. — John Smith
– John Smith, Commented Aug 18, 2015 at 20:43

user229044 · Accepted Answer · 2014-02-07 16:53:51Z

15

AJAX is asynchronous by default, you cannot return a value from the callback without making a synchronous call, which you almost certainly don't want to do.

You should supply a real callback function to the success: handler, and put your program logic there.

edited Feb 7, 2014 at 16:53

answered Feb 13, 2011 at 7:21

user229044♦

241k41 gold badges347 silver badges350 bronze badges

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

3 Comments

Jorge Over a year ago

oh thanks so much.. i already got the idea.. :) by putting my varibles inside of the ajax then append it in the inside.

Amjad Masad Over a year ago

I don't really see the need for callbacks in SYNC AJAX.

Quentin Over a year ago

Sync Ajax is an oxymoron. And sync XHR sucks.

RevanthKrishnaKumar V. · Accepted Answer · 2015-07-31 11:36:58Z

5

var pinNumber = $.ajax({
    type: "POST",
    url: "data.php",
    data: "request_type=generator",
    async: false
}).responseText;
jQuery('.pin_generated_table').append(cardNumber+' = '+pinNumber+' ');

edited Jul 31, 2015 at 11:36

RevanthKrishnaKumar V.

1,9031 gold badge22 silver badges35 bronze badges

answered Feb 13, 2011 at 10:19

Amjad Masad

4,0451 gold badge23 silver badges20 bronze badges

1 Comment

Jaroslav Štreit Over a year ago

Pls dont use this whoever will read this!!! This is WRONG! Our programmer now thinks that ajax is working like this!

Community · Accepted Answer · 2017-05-23 11:46:44Z

4

It has to do with variable scope. The local variable pinNumber you create is not accessible outside its wrapping function.

Perhaps declare pinNumber globally or if it'll do the trick, simply stick your .append() inside your success function.

edited May 23, 2017 at 11:46

CommunityBot

11 silver badge

answered Feb 13, 2011 at 7:22

octopi

2,0041 gold badge12 silver badges16 bronze badges

3 Comments

user229044 Over a year ago

It has nothing to do with variable scope; the .append is executing before the success callback.

octopi Over a year ago

async is false though, meaning .append will run after the AJAX call.

aaronasterling Over a year ago

OP doesn't need to declare the pinNumber globally, it will suffice to not use the var keyword in the assignment to it inside the success handler. The assignment will then affect the enclosing scope.

RevanthKrishnaKumar V. · Accepted Answer · 2015-07-31 11:16:33Z

3

var _successEvent = function(response){
    $('.pin_generated_table').append(cardNumber + ' = ' + response);
};

$.ajax({
    type: "POST",
    url: "data.php",
    data: "request_type=generator"
}).done(_successEvent);

edited Jul 31, 2015 at 11:16

RevanthKrishnaKumar V.

1,9031 gold badge22 silver badges35 bronze badges

answered Sep 14, 2013 at 14:23

kayz1

7,4943 gold badges56 silver badges61 bronze badges

Comments

RevanthKrishnaKumar V. · Accepted Answer · 2015-07-31 11:34:07Z

1

You can use this example:

window.variable = 'some data';

This make you variable global and you can access to this from anywhere

edited Jul 31, 2015 at 11:34

RevanthKrishnaKumar V.

1,9031 gold badge22 silver badges35 bronze badges

answered Oct 2, 2013 at 20:15

Grigoriy

111 bronze badge

1 Comment

ojrask Over a year ago

But when would the implementer know when the value set for window.variable is changed and accessible with the new value?

user2779316 · Accepted Answer · 2013-09-14 14:04:44Z

-3

Here is the simple solution.

    //---------------------------Ajax class ------------------------------//
    function AjaxUtil()
    {
            this.postAjax = function(Data,url,callback)
            {
              $.ajax({
                 url: url,
                 async: true,     //must be syncronous request! or not return ajax results
                 type: 'POST',
                 data: Data,
                 dataType: 'json',
                 success: function(json)
                 {
                     callback(json);
                 }
               });
            }//--end postAjax
    }
    //--------------------------------End class--------------------//
    var ajaxutil = new AjaxUtil();

    function callback(response)
    {
          alert(response); //response data from ajax call
    }

  var data={};
  data.yourdata = 'anydata';
  var url = 'data.php';

  ajaxutil.postAJax(data,url,callback);

answered Sep 14, 2013 at 14:04

user2779316

1

2 Comments

Ingo Bürk Over a year ago

Your comment on async: true is simply lying and wrapping the callback in another function is pointless. Besides, this is unnecessary. What does wrapping it into a class have to do with the question?

user2611793 Over a year ago

Regardless of any of that he's the only one that gave a proper example of the use of success:. The accepted "answer" isn't even an answer as it doesn't give an example.

Collectives™ on Stack Overflow

jQuery ajax return value [duplicate]

6 Answers 6

3 Comments

1 Comment

3 Comments

Comments

1 Comment

2 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

3 Comments

1 Comment

3 Comments

Comments

1 Comment

2 Comments

Linked

Related