Sincronizar llamadas Ajax con Jquery

David Galisteo Cantero

Recientemente tuve un problema realizando peticiones AJAX con Jquery, tenía que hacer 4 llamadas y después ejecutar cierto código en el método ‘done’.

El problema estaba en que necesitaba que se ejecutaran todas las llamadas antes de ejecutar el código.

Veamos cómo sincronizar estas llamadas:

Primero crearemos una función que será la encargada de hacer la petición.

function ajaxGet(url){
     return $.ajax({
	url: url,
	type: "get",
	data:{},
	success: function(response) {
	   	//código
	}
     });
}

Como se puede observar, devolvemos un objeto Ajax de Jquery.

Ahora hacemos distintas llamadas:

var url1 = "url1";
$ajax1 = ajaxGet(rul1);
 
var url2 = "url2";
$ajax2 = ajaxGet(url2);
 
var url3 = "url3";
$ajax3 = ajaxGet(url3);

Una vez hechas las llamadas, ejecutaremos el código que queremos una vez que hayan finalizado, se hará de la siguiente manera:

$.when($ajax1, $ajax2, $ajax3).done(function(){
	//mi código
});

De esta sencilla manera, ejecutaremos el código cuando las 3 peticiones se hayan completado.

Para cualquier duda no dudes en comentarnos.

HackSaludos!

Publicado el 21-07-2015

Compartelo!

2 comentarios

  • Pablo Cartes dice:

    estimado, algo me ayudo pero me sigue fallando…

    debo sincronizar en menu antes de llamar a la pagina menu pero no lo logro, uso indexeddb y bd postgres y jquery mobile

    en el dom cargo:

    //código

    • Por favor no insertes todo el código, es muy complicado para nosotros ver qué hace cada parte del mismo, inserta solo donde hagas las llamadas ajax e intentaremos ayudarte. Y, sobre todo, revista que hagas correctamente la sincronización de las llamadas.

      Gracias y saludos!

Deja un comentario

Comentanos

*
Ir arriba de la pagina