Comment faire pour que jQuery attende la fin d’un appel Ajax avant son retour?

J’ai une fonction côté serveur qui nécessite une connexion. Si l’utilisateur est connecté, la fonction renverra 1 en cas de succès. Sinon, la fonction retournera la page de connexion.

Je veux appeler la fonction en utilisant Ajax et jQuery. Ce que je fais est de soumettre la demande avec un lien ordinaire, avec une fonction de clic appliquée. Si l’utilisateur n’est pas connecté ou que la fonction échoue, je souhaite que l’appel Ajax renvoie true, de sorte que le href se déclenche.

Cependant, lorsque j’utilise le code suivant, la fonction se ferme avant l’appel Ajax.

Comment puis-je redirect l’utilisateur vers la page de connexion?

$(".my_link").click( function(){ $.ajax({ url: $(this).attr('href'), type: 'GET', cache: false, timeout: 30000, error: function(){ return true; }, success: function(msg){ if (parseFloat(msg)){ return false; } else { return true; } } }); }); 

Si vous ne voulez pas que la fonction $.ajax() retourne immédiatement, définissez l’option async sur false :

 $(".my_link").click( function(){ $.ajax({ url: $(this).attr('href'), type: 'GET', async: false, cache: false, timeout: 30000, error: function(){ return true; }, success: function(msg){ if (parseFloat(msg)){ return false; } else { return true; } } }); }); 

Mais, je noterais que cela irait à l’encontre d’AJAX. En outre, vous devez gérer la réponse dans les fonctions d’ error et de success . Ces fonctions ne seront appelées que lorsque la réponse est reçue du serveur.

Je n’utilise pas $.ajax mais les fonctions $.post et $.get , donc si j’ai besoin d’attendre la réponse, j’utilise ceci:

 $.ajaxSetup({async: false}); $.get("..."); 

L’object XMLHttpRequest sous-jacent (utilisé par jQuery pour créer la requête) prend en charge la propriété asynchrone. Réglez-le sur false . Comme

 async: false 

Au lieu de définir async sur false, ce qui est généralement une mauvaise conception, vous pouvez envisager de bloquer l’interface utilisateur pendant que l’opération est en attente.

Cela peut être bien réalisé avec les promesses de jQuery comme suit:

 // same as $.ajax but settings can have a maskUI property // if settings.maskUI==true, the UI will be blocked while ajax in progress // if settings.maskUI is other than true, it's value will be used as the color value while bloking (ie settings.maskUI='rgba(176,176,176,0.7)' // in addition an hourglass is displayed while ajax in progress function ajaxMaskUI(settings) { function maskPageOn(color) { // color can be ie. 'rgba(176,176,176,0.7)' or 'transparent' var div = $('#maskPageDiv'); if (div.length === 0) { $(document.body).append(''); // create it div = $('#maskPageDiv'); } if (div.length !== 0) { div[0].style.zIndex = 2147483647; div[0].style.backgroundColor=color; div[0].style.display = 'inline'; } } function maskPageOff() { var div = $('#maskPageDiv'); if (div.length !== 0) { div[0].style.display = 'none'; div[0].style.zIndex = 'auto'; } } function hourglassOn() { if ($('style:contains("html.hourGlass")').length < 1) $('