jquery - Javascript When and Done Function use - Stack Overflow

admin管理员组

文章数量:1393162

I am trying to call two different functions in third function but one after the other.One function has ajax call, whose values are used in other function. it is step by step process. I don't want to use one into the other.

function f1()
{
    // ajax call 
    return r1
}

function f2(r2)
{
    // do some of the work based on r2
}

function f3()
{
    $.when(f1()).done(function(data){
            f2(data)

    });
}

I also tried with $.when().then(); but still of no use.

Thanks, in advance.

UPDATE :- Below is the answer for my Question based on solution provide by @dreamweiver.

var json_data = '';
function f1()
{

    $.ajax({
         url: "test.php",
         method: "POST",
         async : false,
         data: { },
         success:function(data){
            json_data = eval(data);
         }

       });  


}

function f2(t)
{

    console.log("values is "+t);
}

function f3()
{
    $.when(f1()).done(function(){
        f2(json_data);
   });
}

Thanks everyone for your feedbacks.

I am trying to call two different functions in third function but one after the other.One function has ajax call, whose values are used in other function. it is step by step process. I don't want to use one into the other.

function f1()
{
    // ajax call 
    return r1
}

function f2(r2)
{
    // do some of the work based on r2
}

function f3()
{
    $.when(f1()).done(function(data){
            f2(data)

    });
}

I also tried with $.when().then(); but still of no use.

Thanks, in advance.

UPDATE :- Below is the answer for my Question based on solution provide by @dreamweiver.

var json_data = '';
function f1()
{

    $.ajax({
         url: "test.php",
         method: "POST",
         async : false,
         data: { },
         success:function(data){
            json_data = eval(data);
         }

       });  


}

function f2(t)
{

    console.log("values is "+t);
}

function f3()
{
    $.when(f1()).done(function(){
        f2(json_data);
   });
}

Thanks everyone for your feedbacks.

• javascript
• jquery

Share Improve this question Follow edited May 8, 2015 at 7:08 Purushottam zende asked May 7, 2015 at 8:18 Purushottam zendePurushottam zende 55211 gold badge66 silver badges2020 bronze badges 8

• 1 Did you try $.when(f1).done(function(data){ f2(data) }); – Dawid Pura Commented May 7, 2015 at 8:19
• 3 If you're using jQuery's ajax() then you should just be able to do: f1().then(f2). – James Commented May 7, 2015 at 8:20
• 1 why do you need the f3 function? presumably you want to set the promise then call f1? – atmd Commented May 7, 2015 at 8:20
• 1 Have you tried removing the () after your f1 call? ie. $.when(f1).done(... - if you call it with () then the function will execute instantly. What you probably should be doing is passing it as a variable for jQuery to execute later – Joe Commented May 7, 2015 at 8:20
• @James, i tried ur method but it shows "f1 is undefined" error – Purushottam zende Commented May 7, 2015 at 8:24

 |  Show 3 more ments

2 Answers 2

Sorted by: Reset to default 0

Try this way, I have tested locally and it works perfectly

function deferredCalls () {
   var jsonData = '';
   var f1 = function ()
   {
       // ajax call 
       $.ajax({
         url: "test.html",
         method: "POST",
         data: { id : menuId }
       }).done(function(data) {
          jsonData = data; //set the data
       });
   }

   var f2 = function (data)
   {
     // do some of the work based on data
     if(!!data){
       //process the data
     }
   }
   $.when(f1).done(function(){
        f2(jsonData);
   });
 }

f1 function is called first which would in turn make a ajax request and return data on success, which is set to a function scope variable jsonData. Once this process is pleted, f2 would be called which will start using jsonData, which is nothing but the data received from f1 function call.

This should be working:

function f1() {
    // Or some other Ajax request that returns a promise
    return $.getJSON('path/to/your/service');
}

function f2(r2) {
    // ...
}

f1().done(f2);

本文标签： jqueryJavascript When and Done Function useStack Overflow