Pasar parámetros y ejecutar acciones después de la llamada a Ajax

El método load() que hemos visto en el ejemplo anterior tiene otros dos parámetros opcionales que podemos utilizar si fuera necesario: 

Parámetros a pasar a la página: la página que carguemos con Ajax puede recibir parámetros por la URL, que se especifican con la típica notación de propiedades y valores de jQuery.

{nombre: "Pepe", edad: 45}

Por ejemplo, con ese código estaríamos enviando a la página los datos nombre y edad, con los valores "pepe" y 45. Esos datos viajarían en la URL, por el método "POST". Nota: Desde jQuery 1.3 también se pueden enviar los parámetros a la página a cargar con Ajax por medio de una variable de tipo string, en lugar de una notación de objetos como hemos comentado. Cuando se use un string para especificar los parámetros a enviar en el request http, éstos viajan por el método GET. Cuando se utiliza una notación de objetos como la que hemos visto, los datos viajan por el método POST. 

Función callback: como otros métodos de jQuery, podemos especificar opcionalmente una función a ser ejecutada cuando se termine de ejecutar el método. En este caso, cuando se termine la llamada Ajax, se pueden hacer acciones, como borrar un mensaje típico de "cargando...".

Nota: En un artículo anterior ya comentamos el habitual uso de funciones callback en jQuery.

Ahora veamos un código donde hacemos uso de estos dos parámetros:

$(document).ready(function(){

$("#enlaceajax").click(function(evento){

evento.preventDefault();

$("#destino").load("recibe-parametros.php", {nombre: "Pepe", edad: 45}, function(){

alert("recibidos los datos por ajax");

});

});

})

En este caso estamos cargando con load() una página PHP llamada "recibe-parametros.php". Estamos pasando los parámetros "nombre" y "edad" a una página, que podremos recoger por GET. Además, hemos colocado una función callback en la que simplemente hacemos un alert(), que se ejecutará cuando la llamada a Ajax haya terminado. Este sería el código fuente de "recibe-parametros.php":

Recibido el siguiente dato:
<br>
Nombre: <?php echo $_POST["nombre"];?>
<br>
Edad: <?php echo $_POST["edad"];?>

Podemos ver este ejemplo en una página aparte. Con esto hemos podido comprobar lo sencillo que es realizar con jQuery una carga de contenidos que se reciben por Ajax. Como decía, existen muchas otras maneras de hacer conexiones Ajax con jQuery, como el ejemplo del artículo siguiente que nos enseña a mostrar un mensaje de carga miestrás esperamos la respuesta Ajax del servidor. Además, para complementar esta información, también podéis ver el vídeo de Ajax con jQuery.