The $.when.done() is never called after ajax calls are done
I would like to print foobar
after all 5 ajax calls are done. It means even 4 of them are loaded but 1 of them is still loading, the "foobar" won't be printed yet. I tried many solutions online but still can't print foobar
after all ajax calls are done.
const ajaxCall = (prop, url) => {
return $.ajax({
type: "GET",
url: url,
timeout: 18000000,
success: function (data) {
console.log(data);
db[prop] = JSON.parse(data);
},
error: function (error) {
console.log('ajax error');
}
});
}
const loadData = () => {
let request_1 = ajaxCall('prop1','http://' + host + ':' + port + '/' + workspace + '/api/1.php');
let request_2 = ajaxCall('prop2','http://' + host + ':' + port + '/' + workspace + '/api/2.php');
let request_3 = ajaxCall('prop3','http://' + host + ':' + port + '/' + workspace + '/api/3.php');
let request_4 = ajaxCall('prop4','http://' + host + ':' + port + '/' + workspace + '/api/4.php');
let request_5 = ajaxCall('prop5','http://' + host + ':' + port + '/' + workspace + '/api/5.php');
$.when(request_1,request_2, request_3, request_4, request_5)
.done(() => {
console.log('foobar');
})
}
jquery ajax promise
add a comment |
I would like to print foobar
after all 5 ajax calls are done. It means even 4 of them are loaded but 1 of them is still loading, the "foobar" won't be printed yet. I tried many solutions online but still can't print foobar
after all ajax calls are done.
const ajaxCall = (prop, url) => {
return $.ajax({
type: "GET",
url: url,
timeout: 18000000,
success: function (data) {
console.log(data);
db[prop] = JSON.parse(data);
},
error: function (error) {
console.log('ajax error');
}
});
}
const loadData = () => {
let request_1 = ajaxCall('prop1','http://' + host + ':' + port + '/' + workspace + '/api/1.php');
let request_2 = ajaxCall('prop2','http://' + host + ':' + port + '/' + workspace + '/api/2.php');
let request_3 = ajaxCall('prop3','http://' + host + ':' + port + '/' + workspace + '/api/3.php');
let request_4 = ajaxCall('prop4','http://' + host + ':' + port + '/' + workspace + '/api/4.php');
let request_5 = ajaxCall('prop5','http://' + host + ':' + port + '/' + workspace + '/api/5.php');
$.when(request_1,request_2, request_3, request_4, request_5)
.done(() => {
console.log('foobar');
})
}
jquery ajax promise
1
Code seems fine to me jsfiddle.net/knbtgod8 The problem is elsewhere, check that no errors are thrown (look at network tab)
– CertainPerformance
Jan 20 at 7:20
add a comment |
I would like to print foobar
after all 5 ajax calls are done. It means even 4 of them are loaded but 1 of them is still loading, the "foobar" won't be printed yet. I tried many solutions online but still can't print foobar
after all ajax calls are done.
const ajaxCall = (prop, url) => {
return $.ajax({
type: "GET",
url: url,
timeout: 18000000,
success: function (data) {
console.log(data);
db[prop] = JSON.parse(data);
},
error: function (error) {
console.log('ajax error');
}
});
}
const loadData = () => {
let request_1 = ajaxCall('prop1','http://' + host + ':' + port + '/' + workspace + '/api/1.php');
let request_2 = ajaxCall('prop2','http://' + host + ':' + port + '/' + workspace + '/api/2.php');
let request_3 = ajaxCall('prop3','http://' + host + ':' + port + '/' + workspace + '/api/3.php');
let request_4 = ajaxCall('prop4','http://' + host + ':' + port + '/' + workspace + '/api/4.php');
let request_5 = ajaxCall('prop5','http://' + host + ':' + port + '/' + workspace + '/api/5.php');
$.when(request_1,request_2, request_3, request_4, request_5)
.done(() => {
console.log('foobar');
})
}
jquery ajax promise
I would like to print foobar
after all 5 ajax calls are done. It means even 4 of them are loaded but 1 of them is still loading, the "foobar" won't be printed yet. I tried many solutions online but still can't print foobar
after all ajax calls are done.
const ajaxCall = (prop, url) => {
return $.ajax({
type: "GET",
url: url,
timeout: 18000000,
success: function (data) {
console.log(data);
db[prop] = JSON.parse(data);
},
error: function (error) {
console.log('ajax error');
}
});
}
const loadData = () => {
let request_1 = ajaxCall('prop1','http://' + host + ':' + port + '/' + workspace + '/api/1.php');
let request_2 = ajaxCall('prop2','http://' + host + ':' + port + '/' + workspace + '/api/2.php');
let request_3 = ajaxCall('prop3','http://' + host + ':' + port + '/' + workspace + '/api/3.php');
let request_4 = ajaxCall('prop4','http://' + host + ':' + port + '/' + workspace + '/api/4.php');
let request_5 = ajaxCall('prop5','http://' + host + ':' + port + '/' + workspace + '/api/5.php');
$.when(request_1,request_2, request_3, request_4, request_5)
.done(() => {
console.log('foobar');
})
}
jquery ajax promise
jquery ajax promise
edited Jan 20 at 12:44
20yco
703419
703419
asked Jan 20 at 7:11
Ivanhoe CheungIvanhoe Cheung
815
815
1
Code seems fine to me jsfiddle.net/knbtgod8 The problem is elsewhere, check that no errors are thrown (look at network tab)
– CertainPerformance
Jan 20 at 7:20
add a comment |
1
Code seems fine to me jsfiddle.net/knbtgod8 The problem is elsewhere, check that no errors are thrown (look at network tab)
– CertainPerformance
Jan 20 at 7:20
1
1
Code seems fine to me jsfiddle.net/knbtgod8 The problem is elsewhere, check that no errors are thrown (look at network tab)
– CertainPerformance
Jan 20 at 7:20
Code seems fine to me jsfiddle.net/knbtgod8 The problem is elsewhere, check that no errors are thrown (look at network tab)
– CertainPerformance
Jan 20 at 7:20
add a comment |
1 Answer
1
active
oldest
votes
I just found my code actually does work. The problem is caused by the DB connection issue. The DB is not connected properly but still the AJAX response it as "done".
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54274344%2fthe-when-done-is-never-called-after-ajax-calls-are-done%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
I just found my code actually does work. The problem is caused by the DB connection issue. The DB is not connected properly but still the AJAX response it as "done".
add a comment |
I just found my code actually does work. The problem is caused by the DB connection issue. The DB is not connected properly but still the AJAX response it as "done".
add a comment |
I just found my code actually does work. The problem is caused by the DB connection issue. The DB is not connected properly but still the AJAX response it as "done".
I just found my code actually does work. The problem is caused by the DB connection issue. The DB is not connected properly but still the AJAX response it as "done".
answered Jan 20 at 11:04
Ivanhoe CheungIvanhoe Cheung
815
815
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54274344%2fthe-when-done-is-never-called-after-ajax-calls-are-done%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
1
Code seems fine to me jsfiddle.net/knbtgod8 The problem is elsewhere, check that no errors are thrown (look at network tab)
– CertainPerformance
Jan 20 at 7:20