Angular, AWS und Symfony Freelancer

jQuery asynchroner Ajax Call mit Callback Success Funktion

Bei der Programmierung von asynchronen Funktionen mit Ajax steht man vor dem Problem, dass die Funktion keinen Rückgabewert im herkömmlichen Sinne haben. Die folgende Funktion gibt nicht etwa die Variable response zurück, obwohl der Ajax Request erfolgreich ausgeführt wurde aufgrund der Asynchronität.

function test()
 {
 $.ajax({
 async: true,
 cache:false,
 url: "testUrl.php",
 beforeSend: function (jqXHR, settings) {
 url = settings.url;
 console.log(url);
 },
 success: function (response) {
 console.log("Ajax Call Success");
 },
 error: function (response) {
 handleError(response);
 }
 }
 );
 return response;
 }

Um eine das Ergebnis eines asynchronen Calls (Ajax) weiterverarbeiten zu können, kann man entweder eine Funktion aufrufen (schlecht, weil feste Bindung):

function test()
 {
 $.ajax({
 async: true,
 cache:false,
 url: "testUrl.php",
 beforeSend: function (jqXHR, settings) {
 url = settings.url;
 console.log(url);
 },
 success: function (response) {
 console.log("Ajax Call Success");
 handleMyReponse(response);
 },
 error: function (response) {
 handleError(response);
 }
 }
 );
 return response;
 }

Am besten ist die folgende Lösung, bei der eine Callback-Funktion übergeben wird und die Funktionen lose gebunden sind:

test(function(response){
                handleMyResponse(response);
            }
        );
function test(callback)
 {
 $.ajax({
 async: true,
 cache:false,
 url: "testUrl.php",
 beforeSend: function (jqXHR, settings) {
 url = settings.url;
 console.log(url);
 },
 success: function (response) {
 console.log("Ajax Call Success");
 callback(response);
 },
 error: function (response) {
 handleError(response);
 }
 }
 );
 return response;
 }

 


Posted

in

by

Tags:

Comments

2 Kommentare zu „jQuery asynchroner Ajax Call mit Callback Success Funktion“

  1. Avatar von Antic M.
    Antic M.

    man könnte es auch mit dem $.deferred object lösen, wäre deutlich sauberer

  2. Avatar von Antic M.
    Antic M.

    Eine deutlich besserere und sauberere Lösung wäre mit $.deferred zu arbeiten.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert