How to get the response from the ajax request in another method after the response has been generated?

Question

I want the response generated from the method from which the request has been sent and I need that generated response in another method. Please, refer the below code for further reference.

function foodLog(){


   var data={ 
          servings : $('#demo_vertical').val(),
          calories : $('#calories').text(),
          carbs : $('#carbs').text(),    
   };

       $.ajax({  
             type : "POST",   
             contentType: "application/json; charset=utf-8",
             url : "/fitbase/foodlog/create",
             dataType: "json",
             data : JSON.stringify(data),
             success : function(response) {

             },
             error : function(e) {  
                 alert("Object" +e);
                }  
               });  
   };

The response that is generated after the success I need to get in the below method. I wrote the below code but I am not able to get the response. Please help me out.

function getValues(){
var response = foodLog();
console.log(response)
  }

Answer 1

you may use a callback function to do this efficiently.

function foodLog(callback){  //sending callback function as input

  var data={ 
        servings : $('#demo_vertical').val(),
        calories : $('#calories').text(),
        carbs : $('#carbs').text(),    
  };

   $.ajax({  
         type : "POST",   
         contentType: "application/json; charset=utf-8",
         url : "/fitbase/foodlog/create",
         dataType: "json",
         data : JSON.stringify(data),
         success : callback, //calling callback function when success
         error : function(e) {  
             alert("Object" +e);
            }  
           });  
}


//callback function to handle response
function callback(response){
     console.log(response);
}

---

When you want to call the function "foodLog",

foodLog(callback);

note: you will have to make sure the function callback is loaded before calling this. You may have to use,

$(document).ready(function(){
    foodLog(callback);
});

Answer 2

maybe this one that u want

success : function(response) {  
                 if (response == true){  
                     window.location = "/fitbase/foodlog/create/";   
                     getValues(response);  
                }  

         }

Answer 3

function getValues(response){
  console.log(response);
}

function foodLog(){


 var data={ 
      servings : $('#demo_vertical').val(),
      calories : $('#calories').text(),
      carbs : $('#carbs').text(),    
 };

   $.ajax({  
         type : "POST",   
         contentType: "application/json; charset=utf-8",
         url : "/fitbase/foodlog/create",
         dataType: "json",
         data : JSON.stringify(data),
         success : function(response) {
               getValues(response);
         },
         error : function(e) {  
             alert("Object" +e);
            }  
      });  
};

Answer 4

Either use a variable this way.

 var foodLogResponse = ''; function foodLog(){ var data={ servings : $('#demo_vertical').val(), calories : $('#calories').text(), carbs : $('#carbs').text(), }; $.ajax({ type : "POST", contentType: "application/json; charset=utf-8", url : "/fitbase/foodlog/create", dataType: "json", data : JSON.stringify(data), success : function(response) { foodLogResponse = response; }, error : function(e) { alert("Object" +e); } }); }; 

else you can call the getValues function from within the success handler.

 success : function(response) { if (response == true){ getValues(response); } }