web-dev-qa-db-fra.com

attendre un rappel jquery ajax de la fonction appelante

J'ai passé en revue beaucoup de réponses à ce type de question et maintenant je suis confus quant à la meilleure façon. Compte tenu de la dernière jquery, je veux

  1. Appeler une fonction ajax
  2. faire un traitement ajax (succès ou erreur) // fonctionne bien
  3. en cas de succès ou d'erreur, retourner l'état à la fonction appelante pour un traitement ultérieur

dans la fonction appelante (doAjax), comment puis-je attendre un rappel puis terminer le traitement en cas de succès ou d'erreur (dans ce cas, son succès efface un formulaire, en cas d'erreur le garde tel quel)

Merci pour tout conseil,

Art [EDIT] Il y avait une faute de frappe comme vous l'avez repéré, l'appel aurait dû être doAnAjax et non doAjax

$(function () {
    doAnAjax(Url, data, function (myRtn) {
        if (myRtn == "success") {
            resetForm($('#myForm'));
            resetForm($('form[name=addChlGrp]'));
        } else {
            $('.rtnMsg').html("Opps! Ajax Error");
        }
    });
});

function doAnAjax(newUrl, data) {
    $.ajax({
        url: newUrl,
        async: true,
        dataType: 'html',
        beforeSend: function () {
            $('.rtnMsg').html("<img src=_cssStyleImg_-A-loading.gif>");
        },
        type: "GET",
        data: data,
        cache: false,
        success: function (data, textStatus, xhr) {
            $('.rtnMsg').html(data);
            myRtnA = "Success"
            return myRtnA;
        },
        error: function (xhr, textStatus, errorThrown) {
            $('.rtnMsg').html("opps: " + textStatus + " : " + errorThrown);
            myRtnA = "Error"
            return myRtnA;
        }
    });
}
jqueryajaxcallback
17
art vanderlay

Vous devez utiliser une fonction de rappel. Essayez ceci ci-dessous:

$(function() {

   // I think doAjax should doAnAjax()
   // here you're passing callback
   // but you're not using it doAnAjax()

    doAnAjax(Url, data, function(myRtn) {
        if (myRtnV == "success") {
            resetForm($('#myForm'));
            resetForm($('form[name=addChlGrp]'));
        } else {
            $('.rtnMsg').html("Opps! Ajax Error");
        }
    });
});

// pass callback as third parameter to doAnAjax()

function doAnAjax(newUrl, data, callBack) {
    $.ajax({
        url: newUrl,
        async: true,
        dataType: 'html',
        beforeSend: function() {
            $('.rtnMsg').html("<img src=_cssStyleImg_-A-loading.gif>");
        },
        type: "GET",
        data: data,
        cache: false,
        success: function(data, textStatus, xhr) {
            $('.rtnMsg').html(data);
            myRtnA = "Success"
            return callBack( myRtnA );  // return callBack() with myRtna
        },
        error: function(xhr, textStatus, errorThrown) {
            $('.rtnMsg').html("opps: " + textStatus + " : " + errorThrown);
            myRtnA = "Error"
            return callBack ( myRtnA ); // return callBack() with myRtna
        }
    });
17
thecodeparadox

Comme mentionné précédemment, en utilisant les rappels.

function process(url, params, successCallback, errorCallback) {
    $.ajax({
        success : successCallback,
        error : errorCallback,
        data : params,
        url : url,
        type : 'POST',
        dataType : 'json'
    });
}

process(
    'http://www.google.co.uk', 
    { 
        param1 : 'a' 
    }, 
    function(resp) { 
        alert('Success');
    },
    function() {
        alert('Uh oh');
    }
);

Vous pouvez ensuite passer n'importe quelle fonction à process et elle sera appelée en cas de succès/erreur.

4
Gavin

La réponse est non, mais elle est facilement réalisable. L'idée de AJAX est qu'il est asynchrone, d'où le A JAX. Cela signifie que la fonction qui appelle à l'origine votre ajax n'attendra pas qu'il se termine et à la place, tout le travail doit être terminé après un appel ajax devrait être dans les gestionnaires de réussite ou d'erreur.

Si vous avez besoin que quelque chose soit synchrone, vous pouvez changer votre indicateur de async:true à async:false mais alors cela devient vraiment un appel SJAX (même pas sûr que le terme existe mais, techniquement, ce n'est plus un appel AJAX appel)).

2
Jon Taylor

Découvrez 'dérivé' dans jquery. L'exemple ci-dessous utilise deferred.done avec async désactivé et semble fonctionner pour moi.!

$.ajax({
    url: "http://www.whatever.com/whatever",
    async: false }).done(function( data ) {
        alert(data); //or whatever
    })
0
Chase Saunders