En los artículos anteriores escribí sobre la metodología AJAX y la manera que tenemos de implementarla por medio de Javascript. Pero como ya vimos, el trabajo de esta manera es tedioso.

En este artículo vermos algunos de los métodos de JQuery más importantes a la hora de recuperar datos por medio de AJAX.

Método $.ajax()

Este es el método más completo a la hora de realizar una petición por AJAX de cualquier tipo. Lo que hace este script es llamar a la página “detalleProducto.php” enviándole como parámetro un “id”. El resultado de la página se mete en un div llamado “fichaProducto“.

Algunos de los atributos más importantes de este método son:

  • url – URL a la que se llamará
  • type – Método HTTP de la petición
  • data – Parámetros de la petición. Independientemente del método HTTP se envían en formato QueryString (“par1=val1&par2=val2”)
  • beforeSend – Función donde se especifica qué hacer antes de enviar la petición. Por si se necesitan modificar cabeceras.
  • success – Función donde se especifica qué hacer si la respuesta del servidor ha sido positiva
  • error – Función donde se especifica qué hacer si la respuesta del servidor ha sido negativa
  • complete – Función donde se especifica qué hacer independientemente del resultado de la petición
  • dataType – Especifica el tipo de datos con el que se van a trabajar (XML, json…)

Métodos $.get() y $.post()

Estos métodos permiten realizar una llamado por GET o por POST. Este método es algo más limitado en cuanto a opciones que el anterior, ya que como parámetros, sólo se especifican la URL, los parámetros de la petición, el callback si la petición ha sido correcta y el tipo de dato a manejar. Este script hace exactamente lo mismo que el ejemplo anterior: llamar a la página “detalleProducto.php” enviándole como parámetro un “id“. El resultado de la página se mete en un div llamado “fichaProducto“.

Método .load()

Este método permite recuperar por AJAX el resultado JSON de una url. Los parámetros que acepta son la URL, los parámetros de la petición y el callback si la petición ha sido correcta. Este script llama a la url “/productos/listar” y los datos de productos que ha recibido los utiliza para incluirlos como elementos de un <ul>.

Con esto ya hemos visto algunos de los métodos más importantes de JQuery para realizar llamadas por AJAX.

¡Hasta la próxima!

Rupert.