use succes or complete in ajaxcall

Question

Hello,

My question is that I want to know what the difference is in the ajaxcall below

If I substitute complete for success I get an empty responseText as the error says and with complete it works like it is supposed to

Is it that success returns sooner then 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;
    });

thanks, Richard

Answer 1

"complete" executes when the ajax call is finished. "success" executes when the ajax call finishes with a successful response code.

Answer 2

complete executes after either the success or error callback where executed.

Maybe you should check the second parameter complete offers too. It's a String holding the type of success the ajaxCall had.

The different callbacks are described a little more in detail here jQuery.ajax( options )

---

I guess you missed the fact that the complete and the success function (I know inconsistent API) get different data passed in. success gets only the data, complete the whole XMLHttpRequest object. Of courese there is no responseText property on the data string.

So if you replacte complete with success you also have to replace data.responseText with data only.

success

The function gets passed two arguments: The data returned from the server, formatted according to the 'dataType' parameter, and a string describing the status.

complete

The function gets passed two arguments: The XMLHttpRequest object and a string describing the type of success of the request.

If you need to have access to the whole XMLHttpRequest object in the success callback I suggest trying this.

var myXHR = $.ajax({
    ...
    success: function(data, status) {
        ...do whatever with myXHR; e.g. myXHR.responseText...
    },
    ...
});