Jquery continuar con otra función ajax después de que la primera llamada a la función ajax se haya completado completamente

Question

Tengo 2 llamadas ajax en 2 funciones de diferencia. Deseo utilizar .click para llamar a estas 2 funciones . El func1 está insertando datos en la base de datos, luego func2 es recuperar los datos, así que mi pregunta es cómo esperar hasta que la función esté completamente completa, entonces solo ejecuta el func2.

Probé .delay(), funciona, pero creo que esta es una solución estúpida.

$("#updateLocation").click(function(e){ 
     e.preventdefault; 
     func1(); 
     func2(); 
     }); 
     return false; 
    }); 

    function func1(){ 
     $.ajax({ 
     url:'', 
     }); 
}); 

    function func2(){ 
     $.ajax({ 
     url:'', 
     }); 
})； 

Answer 1

tres maneras: func2

de llamadas en caso de éxito de func1:

function func1() { 
     $.ajax({ ... }).done(func2); 
    } 

Uso Deferred API para llamar a func2 cuando se complete cobardes:

e.preventDefault(); 
    $.when(func1).then(func2); 

Hacer func1 síncrona (no recomendado):

function func1() { 
     $.ajax({url: '', async: false}); 
    } 

Answer 2

Puede establecer la opción "async" en falso (para la primera llamada ajax).

Esto significa que se llamará a la función 2 después de que la función 1 haya recibido una respuesta, es decir, haya finalizado su ejecución.

function func1(){ 
     $.ajax({ 
     url:'', 
     async: false 
     }); 
}); 

Answer 3

Mover func2 dentro func1-> AJAX> éxito de devolución de llamada

$("#updateLocation").click(function(e) { 
    e.preventdefault; 
    func1(); 
    //func2(); 
}); 
return false; 
}); 

function func1() { 
    $.ajax({ 
     url: '', 
     success: function() { /* other stuff */ 
      func2(); 
     } 
    }); 
}); 

function func2() { 
    $.ajax({ 
     url: '', 
    }); 
})； 

Answer 4

llamada fun2 en el éxito de Func1

function func1(){ 
    $.ajax({ 
    url:'', 

    success:function(){ 
     func2(); 
    } 
    }) 

Answer 5

ya que las llamadas Ajax son asíncronas, la aplicación no 'pausa' hasta se completa una llamada ajax y simplemente comienza la próxima llamada inmediatamente.

JQuery ofrece un controlador que se llama cuando la llamada es exitosa, y otro si se produce un error durante la llamada.

$.ajax({ 
    url: 'ajax/test.html', 
    success: function(data) { 
    $('.result').html(data); 
    alert('Load was performed.'); 
    }, 
    error :function(jqXHR, textStatus, errorThrown) 
    { 
    alert("something went wrong"); 
    } 
}); 

Querrá llamar a su segunda función AJAX desde el controlador de éxito.

Answer 6

también se puede pasar su función como un parámetro de esta manera:

var secondFunc = function (func) { 

    //Do ajax req or smt 
    func("answer", "params"); 

}; 
var firstFunc = function() { 

    secondFunc(
     function (answerFromFunc2, paramsFromfunc2) { 

      var a = answerFromFunc2; 
      var b = paramsFromfunc2; 

     } 
    ); 

    //Do smt after the function request to the server is done 
    var doSmt = "another func or variable"; 

}; 
firstFunc();