Xajax - ejemplo paso a paso

Para los novatos como yo implementar ajax en nuestras webs puede ser muy muy complicado y tedioso. La biblioteca php Xajax de código abierto facilita muchísimo el trabajo de implementar la tecnología ajax utilizando funciones que convertirán código php en funciones ajax.

Y aunque sea novato no me quiero perder el ajax para crear webs dinámicas pero atractivas. Por supuesto se pueden crear webs dinámicas sin ajax con la consiguiente recarga y lentitud.

¿Qué es Xajax?

Xajax es una biblioteca php open source que nos va a facilitar, y mucho, el desarrollo de aplicaciones web con tecnología ajax. Además necesitará un poco de html, un poco de css y un poco de Javascript. Así el usuario va a poder solicitar información al servidor y obtenerla de forma dinámica y atractiva sin tener que recargar páginas enteras.

Todo el proceso el manejado por el objeto Xajax(). Creamos nuestras funciones php, las registramos usando el método register(XAJAX_FUNCTION,'mifuncion') (tantas como queramos) y finalmente procesamos la información con xajax->processRequest(). Más adelante veremos los 7 pasos básicos.

Igual os preguntáis por qué xajax y no otras de los tantos frameworks y bibliotecas de ajax que hay disponibles. Bien, para mí me resulta mucho mejor xajax por estar centrada en php. Las demás suelen usar mucho más javascript y no es mi fuerte. Con ajax las sentencias de javascript a escribir son bastantes simples. Además de ser compatible con la mayoría de navegadores y poder utilizarse para actualización de cualquier atributo de un elemento y poder registrar distintas funciones cada una con sus propias peticiones.

Los 7 pasos básicos para implementar Xajax

1.- Por supuesto el primer paso es incluir la biblioteca Xajax en nuestro php, las descargamos la ponemos en nuestro y servidor e cinluimos la biblioteca xajax en nuestro código. (no olvides añadir la ruta de este archivo si lo tienes en lugar diferente)

require_once("xajax.inc.php");

2.- Crear una nueva instancia del objeto xajax que controlará el proceso.

$xajax = new xajax();

3.- Registramos en el objeto xajax las funciones que vamos a usar en la aplicación.

$xajax->register(XAJAX_FUNCTION,"miFuncion");

O también:

$xajax->registerFunction("miFuncion");

4. -Escribir nuestras funciones php que vayamos a usar en la aplicación ajax. Imprescindible: Esta función ha de devolver el XML. Pero tranqui, que esto lo hará Xajax.

function miFuncion($argumentos) { 

  // realiza el proceso que necesites con la variable $argumentos
  // pon el resultado en otra variable, por ejemplo $respuesta
  // Crea una nueva instancia del objeto xajaxResponse 
  $objResponse = new xajaxResponse();

  // escribe la respuesta en algún elemento html definido con una id
  //para que cambie su contenido por el de la variable $respuesta
  $objResponse->assign("ElementId","innerHTML", $respuesta);

  //debuelve el XML generado por xajaxResponse
  //a veces no es necesario usar getXML() y devolver $objResponse es suficiente
  return $objResponse->getXML(); 
}

5.- Llamamos a xajax para que procese los pedidos

$xajax->processRequest();

6.- Incluir el javascript axjax generado desde xajax

$xajax->printJavascript();

7.- Ahora nos queda llamar la función desde un evento que realice el usuario en la web, por ejemplo el clic en un botón de un formulario.

onclick="xajax_myFunction(SomeArgument);"

Ya que tenemos los 7 pasos vamos a aplicarlo a un ejemplo xajax concreto muy sencillito: vamos a cargar un formulario de registro diferente para usuarios y para empresas (nota que el envío del formulario no va estar activo). Puedes ver el ejemplo en vivo aquí. Aunque el ejemplo es muy sencillo y básico creo que puede ser muy ilustrativo. Descargar código usado en el ejemplo