For example I have a ajax function like below
$.ajax({
url: '/dashboard/getTrend'+'?period=30d' +"&profileId=" +"119",//getting the api
type: 'get',
success: function(data){
console.log(data.result);
}
});
in above it only calls the profile 119 but i'd like to call 118 and 177 too, i'd like to know how to do it in a for loop, because in reality it the number of api we need to call will be unknown
url: '/dashboard/getTrend'+'?period=30d' +"&profileId=" +"118",
url: '/dashboard/getTrend'+'?period=30d' +"&profileId=" +"177",
The below is INCORRECT method i just want to give out my think
$.ajax({
url: '/dashboard/getTrend'+'?period=30d' +"&profileId=" +"119",
'/dashboard/getTrend'+'?period=30d' +"&profileId=" +"118",'/dashboard/getTrend'+'?period=30d' +"&profileId=" +"177",
//getting the api
type: 'get',
success: function(data){
console.log(data.result);
}
});
//trend chart
function trend1(){
$.ajax({
url: '/dashboard/getTrend'+'?period=30d' +"&profileId=" +"119",//getting the api
type: 'get',
success: function(data){
console.log(data.result) //correct
}
});
}
function trend2(){
$.ajax({
url: '/dashboard/getTrend'+'?period=30d' +"&profileId=" +"120",//getting the api
type: 'get',
success: function(data){
console.log(data.result) //correct
}
});
}
$.when( trend1(), trend2()).done(function(trend1_data, trend_data){
console.log(trend1_data.result)
console.log(trend2_data.result)
});
i tried to do this is this correct?
UPDATE 2:
function trend1() {
return $.ajax({
url: '/dashboard/getTrend' + '?period=30d' + "&profileId=" + "119", //getting the api
type: 'get',
success: function(data) {
console.log(data.result)
}
});
}
function trend2() {
return $.ajax({
url: '/dashboard/getTrend' + '?period=30d' + "&profileId=" + "120", //getting the api
type: 'get',
success: function(data) {
console.log(data.result)
}
});
}
$.when(trend1(), trend2()).done(function(trend1_data, trend2_data) {
console.log(trend1_data.result) //undefined
console.log(trend2_data.result)//undefined
});
I tried to modify the function to this but the console.log()
inside the when function are not defined, which means it read nothing.
You can't pass multiple URL to $.ajax()
method, However jQuery.when() can be used.
$.when(
$.ajax( {url: '/dashboard/getTrend'+'?period=30d' +"&profileId=" +"119", method:"GET"}),
$.ajax( {url: '/dashboard/getTrend'+'?period=30d' +"&profileId=" +"177", method:"GET"}),
)
.done(function( a1, a2 ) {
// a1 and a2 are arguments resolved for the url1 and url2 ajax requests, respectively.
// Each argument is an array with the following structure: [ data, statusText, jqXHR ]
});
You need to return the promise from your trend1
and trend2
method
//trend chart
function trend1() {
return $.ajax({
url: '/dashboard/getTrend' + '?period=30d' + "&profileId=" + "119", //getting the api
type: 'get',
success: function(data) {
console.log(data.result)
}
});
}
function trend2() {
return $.ajax({
url: '/dashboard/getTrend' + '?period=30d' + "&profileId=" + "120", //getting the api
type: 'get',
success: function(data) {
}
});
}
$.when(trend1(), trend2()).done(function(trend1_data, trend_data) {
console.log(trend1_data.result)
console.log(trend2_data.result)
});
You can use multiple url using $.each
var locationOne = '/dashboard/getTrend?period=30d&profileId=119';
var locationTwo = '/dashboard/getTrend?period=30d&profileId=120';
var multipleURL = [locationOne, locationTwo];
$.each(multipleURL, function (i, url) {
$.ajax(url,
{
type: 'POST',
data: {
},
success: function (data) {
}
}
);
});