Este videotutorial está indicado para las personas que quieren dar sus primeros pasos con jQuery y desean ver cómo se hace una de las tareas más solicitadas dentro de la programación con este popular framework Javascript. Se trata de una conexión Ajax, realizada paso a paso, para que todas las personas puedan entenderla.

En el vídeo mostraremos cómo realizar la página web que hará la conexión Ajax, desde el principio, incluyendo el script del framework jQuery y luego programando el script de la llamada a Ajax. Además, por complicar un poco más el ejemplo, hemos implementado directamente un mensaje de carga, que se mostrará cuando se inicie la conexión y se ocultará una vez que haya terminado con éxito.

Este vídeo ilustra de manera entendible todo el proceso que ya habíamos explicado en anteriores artículos de DesarrolloWeb.com, concretamente dentro del Manual de jQuery que ponemos a disposición de los lectores del sitio. Los artículos que deberían leerse como complemento a este vídeo son Uso de Ajax muy sencillo con jQuery y el siguiente capítulo del manual llamado Ajax jQuery con mensaje de carga.

El proceso de realización de una solicitud Ajax en jQuery es extremadamente simple, puesto que con una única línea de código se implementa toda la llamada por Ajax e incluso el volcado de la respuesta en un elemento de la página. Sin embargo, se requieren diversas líneas de código adicionales para realizar cosas como la ejecución de código sólo cuando el navegador está listo para recibir acciones que modifiquen el DOM, la codificación de un evento para que se solicite la página por Ajax como respuesta a un clic del usuario que visita la página, etc. Además, el script, como decíamos, también realiza la tarea de mostrar un mensaje de carga mientras que la solicitud está pendiente, con lo que hay que agregar alguna línea de código adicional también por este motivo. Luego haremos un pequeño script PHP que tenga un retardo, para que la solicitud Ajax tarde un poco más en obtener respuesta y podamos llegar a ver el mensaje de carga.

Como se podrá ver en el videotutorial, esta tarea no tiene mucha dificultad, pero serán necesarios conocimientos de varios ámbitos para poder entenderla toda.

Por cierto, durante el vídeo trabajamos con un editor de texto para programadores llamado Komodo Edit, lo que puede resultar de interés para las personas que no conozcan este editor de código fuente gratuito. Komodo Edit tiene un previsualizador que nos permite ver en ejecución, durante las primeras pruebas, la página que vamos realizando. Aunque la parte en la que trabajamos con PHP la tenemos que ejecutar a través de un servidor web y luego ver en un navegador. Nosotros como servidor web utilizamos Wamp, que instala en un solo paso todo lo necesario para ejecutar páginas PHP.

El vídeo lo hemos publicado en YouTube y producido en menos de 10 minutos, por requerimientos de dicho sitio web. No obstante, creemos que ha quedado un videotutorial suficientemente claro y con las necesarias explicaciones para que todas las personas puedan entenderlo prestando suficiente atención.

Sin más, os dejamos con este vídeo que esperamos pueda servir de utilidad a todas las personas que quieren desarrollar sus páginas con Ajax y utilizar una de las herramientas más populares para facilitarnos la vida al programar páginas con scripts del lado del cliente.