ajax: instalación de xajax y ejemplo (parte 2)

7 de julio de 2008

Para utilizar xajax nos bajaremos la versión estable que encontremos pero como aun no he probado la versión 0.5 (que está en beta) aprovecharé para probarla con este post. Bajaré xajax_0.5_beta_4b_Full.zip y descomprimiremos en nuestro servidor dentro de una carpeta temporal.
Una vista rápida al Zip y veremos que con la versión full tenemos toda la documentación de xajax dentro de /documentation y un montón de ejemplos dentro de /examples y /tests.

Las carpetas que realmente necesitaremos serán /xajax_core y /xajax_js. Copiaremos estas dos carpetas dentro de nuestro sitio web. Para crear paginas web en PHP y que utilicen Ajax necesitamos seguir una metodología cuando creemos nuestras paginas webs. El objetivo de xajas es crear funciones escritas en PHP (que realizan cualquier tipo de operación) y hacerlas disponibles en Ajax para poder utilizarlas desde cualquier página HTML.

Veamos pues como utilizamos xajax para crear el mismo ejemplo que creamos en la parte 1.

Lo primero que haremos es crear nuestra función PHP (que se ejecuta en el servidor) la cual le pasamos dos números y los suma. Crearemos el archivo misfunciones.server.php y pondremos este código:

<?php
function suma($a, $b) {
   $objResponse = new xajaxResponse();
   $objResponse->assign("resultado", "value", $a+$b);
   return $objResponse;
}
require("misfunciones.common.php");
$xajax->processRequest();
?>
Creamos la función, creamos un objeto de respuesta, asignamos la suma a una variable llamada resultado y devolvemos la respuesta al cliente.

Ahora crearemos otro archivo PHP llamado misfunciones.common.php donde definiremos que funciones de nuestro PHP queremos hacer publicas en Ajax:

<?php
require_once ("xajax_core/xajax.inc.php");
$xajax = new xajax("misfunciones.server.php");
$xajax->registerFunction("suma");
?>
De todas las funciones que hay dentro de misfunciones.server.php solo queremos hacer publica la función suma().

Ahora lo más divertido. Crearemos nuestro formulario llamado parte2.php donde pediremos dos números (el "a" y el "b") y llamaremos a nuestra función de Ajax para que los sume y nos devuelva el resultado.

<?php
require("misfunciones.common.php");
?>
<html>
<head>
   <?php $xajax->printJavascript('/'); ?> 
</head> 
<body> 
   <input type="text" name="a" id="a" value="0"> + <input type="text" name="b" id="b" value="0"> = 
   <input type="text" name="resultado" value="" size="3" /> 
   <input type="button" value="Calcular" onclick="xajax_suma(document.getElementById('a').value,
   document.getElementById('b').value)">
</body> 
</html>
Lo más importante es la función xajax_suma. Todas las funciones que definamos y publiquemos tendrán el prefijo "xajax_". Es interesante ver el codigo fuente del cliente de parte2.php y ver en que se convierte el "$xajax->printJavascript('/');". Es toda la lógica necesaria en JavaScript para poder hacer las llamadas a las funciones PHP.
parte2.zip (archivos fuente)