Valoración del artículo:Para comenzar, estaría bien comentar que la clase "padre" de Prototype para realizar conexiones HTTP asíncronas se llama Ajax, pero que esta clase es abstracta y para utilizarla debemos trabajar con alguna de las clases que heredan de esta. La clase Ajax general permite algunos tipos de personalización de la solicitud muy útiles, los cuales sirven también para las solicitudes Ajax que podemos hacer cuando utilizamos las clases heredadas, como Ajax.Updater o Ajax.Request. Por lo que la mayoría de las explicaciones que veremos sirven para cualquier tipo de conexión Ajax en Prototype.
En el ejemplo del artículo anterior vimos un caso de uso de Ajax.Updater y ahora vamos a mostrar cómo utilizar otra clase más básica llamada Ajax.Request, que es exactamente igual, salvo que ésta no actualiza la información de la respuesta automáticamente en la página.
Por ejemplo veamos el siguiente código de uso de la clase Ajax.Request:
new Ajax.Request('recibir-parametros.php',{
method: 'get',
parameters: {miparametro: 'El valor!', otro: 99},
onSuccess: function(respuesta){
alert(respuesta.responseText);
}
});
Como se puede ver, el constructor de la clase Ajax.Request recibe como primer parámetro la URL que se va a solicitar con Ajax y como segundo parámetro un objeto con todas las propiedades y funciones para personalizar la solicitud.
En este caso hemos especificado diversos valores como:
<html>
<head>
<title>Recibir contenido por Ajax</title>
<script src="../prototype-1.6.0.3.js" type="text/javascript"></script>
<script>
function recibirAjax(){
new Ajax.Request('recibir-parametros.php',{
method: 'get',
parameters: {miparametro: 'El valor!', otro: 99},
onSuccess: function(respuesta){
alert(respuesta.responseText);
}
});
}
</script>
</head>
<body>
- <a href="javascript: recibirAjax();">Pulsame para recibir un contenido con Ajax</a>
</body>
</html>
También necesitaremos crear una página, a la que llamamos por Ajax, que recibe los parámetros enviados en la solicitud. En este caso a página es PHP, pero podríamos utilizar cualquier otra tecnología de programación del lado del servidor.
El código de esa página sería parecido a esto:
<?
echo "La respuesta!. He recibido: " . $_GET["miparametro"] . " / " . $_GET["otro"];
?>
Ahora podemos ver esta página en marcha.
Para ello simplemente tenemos que modificar un poco el script anterior, para crear el comportamiento que muestre el mensaje de carga. Por variar un poco, en este caso utilizaremos Ajax.Updater, de una manera muy similar.
$('cargando').update("Cargando...");
new Ajax.Updater('contenidoajax', 'recibir-parametros.php', {
method: 'get',
parameters: {miparametro: 'lo que sea', otro: 58},
onSuccess: function(){
$('cargando').update("");
}
});
En este caso hemos creado una primera línea de código, justo antes de la solicitud Ajax, que actualiza el texto del elemento con identificador "cargando". En ese elemento colocamos el mensaje de carga. Nosotros hemos actualizado el contenido colocando un texto, pero podríamos haber colocado una imagen, ya que update() acepta cualquier código HTML.
Luego se codifica la solicitud Ajax, en la que hemos colocado en el evento onSuccess una línea de código para eliminar el mensaje de carga una vez hemos recibido una respuesta correcta del servidor, utilizando el mismo método update() sobre el elemento de la página deseado.
A continuación se puede ver el código completo de este ejemplo:
<html>
<head>
<title>Recibir contenido por Ajax</title>
<script src="../prototype-1.6.0.3.js" type="text/javascript"></script>
<script>
function recibirAjax(){
$('cargando').update("Cargando...");
new Ajax.Updater('contenidoajax', 'recibir-parametros.php', {
method: 'get',
parameters: {miparametro: 'lo que sea', otro: 58},
onSuccess: function(){
$('cargando').update("");
}
});
}
</script>
</head>
<body>
<div id="contenidoajax"></div>
<p>
- <a href="javascript: recibirAjax();">Pulsame para recibir un contenido con Ajax</a>
<p>
<div id="cargando"></div>
</body>
</html>
Si se desea, podemos poner en marcha el ejemplo en una página aparte.
Con esto hemos visto lo sencillo que es hacer Ajax con Prototype. Pero sin duda, lo más útil e interesante es que con Prototype podemos construir scripts Ajax que son compatibles con todos los navegadores, sin necesidad de preocuparnos por las diferentes particularidades de cada uno.
Usuarios: 
