Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

138
Views
multiple ajax call to single function javascript

I have 3 ajax call. Data from each ajax call is passed to john_doe();

Call 1

$.ajax({
        url: url1,
        dataType: "JSON",
        type: "GET",
      }).success(function(data1){

    john_doe(data1);
});

Call 2

$.ajax({
        url: url2,
        dataType: "JSON",
        type: "GET",
      }).success(function(data2){

    john_doe(data2);
});

Call 3

$.ajax({
        url: url3,
        dataType: "JSON",
        type: "GET",
      }).success(function(data3){

    john_doe(data3);
});

Main function

function john_doe(param){
console.log(param); //Print data from all three ajax call.
}

How to separate data1, data2 and data3 in john_doe function? because I need to carry out arithmetic operation.

Currently,

Input

data1 = one,two,three
data2 = four
data3 = five

Output

console.log(param) would give output as

one
four
five

I want output as

console.log(param[0])
console.log(param[1])
console.log(param[2])

param[0] containing one,two,three
param[1] containing four
param[2] containing five

I dont have control over the data. How to access data1, data2 and data3 separately?

about 4 years ago · Santiago Trujillo
3 answers
Answer question

0

Using promises you can access all the data in Promise.all() callback and do whatever you need with it all at once. Assumes using jQuery 3+. Can use $.when in older versions

  var urls =['data-1.json','data-2.json','data-3.json'];
  // array of ajax promises
  var reqPromises = urls.map(function(url){
    return $.ajax({
       url: url,
       dataType: "JSON",
       type: "GET"
    });
  });

  Promise.all(reqPromises).then(function(res){
     // res is array of all the objects sent to each `$.ajax` from server
     // in same order that urls are in
     var param = res.map(function(item){
       return item.val
     });

     console.log(param)
  })

DEMO

about 4 years ago · Santiago Trujillo Report

0

Quick and dirty solution is simply pass in an identifier, why is this dirty because it isn't really extensible with respect to adding say 4th or 5th call each time you do this you need to add more identifiers and your if statement in the main method will end up pretty ugly at one point. But that said sometimes "Keeping It Simple" is ok.

Main function:

function john_doe(identifier, param) {

    // best to use something more readable then numbers
    if(identifier == 1) {    
       console.log(param); //Print data from all ajax call 1.
    } else if(identifier == 2) {
       console.log(param); //Print data from all ajax call 2.
    } else if(identifier == 23) {
       console.log(param); //Print data from all ajax call 3.
    } else {
       // handle bad id
    }
}

In your ajax calls, pass in the right identifier, for example Call 2:

    $.ajax({
        url: url2,
        dataType: "JSON",
        type: "GET",
      }).success(function(data2){

    // numeric 2 in in the first param is your identifier
    john_doe(2,data2); });
about 4 years ago · Santiago Trujillo Report

0

Adding a param to let you know where it is being called from

Call 1

$.ajax({
        url: url1,
        dataType: "JSON",
        type: "GET",
      }).success(function(data){

    john_doe('call1',data);
});

Call 2

$.ajax({
        url: url2,
        dataType: "JSON",
        type: "GET",
      }).success(function(data){

    john_doe('call2',data);
});

Call 3

$.ajax({
        url: url3,
        dataType: "JSON",
        type: "GET",
      }).success(function(data){

    john_doe('call3',data);
});

Main function

function john_doe(call,data){
    console.log('Called from : ' + call);
    console.log(data); //Print data from all three ajax call.
}
about 4 years ago · Santiago Trujillo Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!