I want to understand the AJAX call below, in terms of the complete()
method;
When I replace complete()
with success()
, I get an empty responseText just as with the AJAX error()
method.
On the other hand, when I leave the complete()
method there as it is, everything works as expected.
Is it that success()
returns earlier than complete()
?
$("#formnaw").submit(function() {
var fnc = invoerFnc.attr("value");
var vnaam = invoerVnaam.attr("value");
var anaam = invoerAnaam.attr("value");
var str1 = invoerStr1.attr("value");
var nr1 = invoerNr1.attr("value");
var pc1 = invoerPc1.attr("value");
var pl1 = invoerPl1.attr("value");
var tel1 = invoerTel1.attr("value");
var mob1 = invoerMob1.attr("value");
var em1 = invoerEm1.attr("value");
var goknop = $("#formnaw > .instelling_go");
//we deactiveren de submit knop tijdens het verzenden
goknop.attr({
disabled: true
});
goknop.blur();
//stuur de post variabelen naar livetabs.php
$.ajax({
type: "POST",
url: "registraties/instellingenact.php",
data: "actie=wijzignaw&vnaam=" + vnaam + "&anaam=" + anaam + "&functie=" + fnc + "&straat=" + str1 + "&nr=" + nr1 + "&postcode=" + pc1 + "&plaats=" + pl1 + "&tel=" + tel1 + "&mob=" + mob1 + "&email=" + em1,
timeout: 5000,
success: function(data, textStatus) {
alert('bij success');
//doe iets
} //EINDE success
,
error: function(XMLHttpRequest, textStatus, errorThrown) {
if (textStatus == 'timeout') {
//doe iets
} else if (textStatus == 'error') {
//doe iets
}
//her-activeer de zend knop
goknop.attr({
disabled: false
});
} //EINDE error
,
complete: function(data) {
updatelijst.append(data.responseText + "<br>");
if (data.responseText.indexOf("Fout") != -1) {
$('#formnaw').find('td.foutnr1').prepend(data.responseText);
} else {
updatelijst.animate({
opacity: 'show'
}, 1000, function() {});
}
//her-activeer de zend knop
goknop.attr({
disabled: false
});
} //EINDE complete
}); //EINDE ajax
//we stoppen het standaard gedrag van een submit, zodat de pagina niet wordt vernieuwd.
return false;
});
Best Answer
Yes; the AJAX
success()
method runs before thecomplete()
method.Below is a diagram illustrating the process flow:
It is important to note that
The
success()
(Local Event) is only called if the request was successful (no errors from the server, no errors with the data).On the other hand, the
complete()
(Local Event) is called regardless of if the request was successful, or not. You will always receive a complete callback, even for synchronous requests.... more details on AJAX Events here.