[EN PROCESO] Ariath's AJAX Kit

Bueno, bajo ese... extraño nombre, se esconde en lo que estoy trabajando actualmente.

Lo llevo semi-avanzado, aunque todavía haciendo muchas pruebas.

Se trata de un kit de librerías (o clases), que estoy desarrollando para trabajar cómodamente con AJAX en desarrollo web.

Lo primero, para el que no lo sepa, AJAX, literalmente significa "Asynchronous Javascript And XML".

Basicamente, se trata de usar un objeto de JavaScript llamado XMLHttPRequest, el cual, permite la nada desdeñable capacidad, de enviar peticiones, datos, a un servidor ejecutando por ejemplo un lenguaje de lado del servidor, como es PHP, y con eso, realizar... pues desde simples consultas a bases de datos obteniendo la información resultante, hasta incluso desarrollar webs enteras dinámicas... y todo ello sin tener que refrescar el navegador .

En fin, no se si os lo habré aclarado bien, porque con AJAX estoy trabajando desde hace relativamente poco, y bueno... no acabo de entender bien al completo todo el tema, pero basicamente es lo dicho.

Yo personalmente, uso AJAX para poder realizar consultas a MySQL y con los resultados, llenar controles de formularios (por ejemplo), y todo ello ya digo, sin refrescar la web.

En fin, después de este rollo... el kit se compone de varios archivos PHP y JavaScript. Los archivos PHP, como se podría pensar, contienen lo necesario para realizar consultas a MySQL y devolver los resultados.

Y en la parte de JavaScript, se encuentran las funciones que permiten crear el objeto XMLHttpRequest para trabajar con AJAX, para rellenar campos de formularios dinamicamente dados sus IDs y los datos para rellenarlos, y también, para enviar como no las peticiones de datos a MySQL.

Entre los archivos, hay 1 que es un poco especial, se llama ArrayTools, y está tanto para PHP como para JavaScript, y son rutinas para transformar un Array (Tabla o matriz) en un String, y viceversa.

Esto es necesario porque, entre los 2 lenguajes, se puede pasar texto (Strings), pero no objetos (como son los Arrays). Por esta razón, idee estas funciones que, dados los datos necesarios (un Array, o String (según el caso), y los caracteres o cadenas con los que se van a delimitar filas y columnas), crean un Array a partir de un string recibido, o al reves.

Los archivos los voy comentando (solo las funciones) para que sean lo más legibles posibles, y también he procurado que sean altamente reutilizables.

El hacer estas librerías, ha venido a cuento de que, para ir realizando cosas con la base de datos del juego por vía web, pues digamos que antes necesito crear las herramientas necesarias... y ya puestos, si dichas herramientas las hago reutilizables, pues no solo me sirven para cualquier trabajo con formularios y bases de datos, sino que también le sirven a otros.

Cuando vaya teniendo cosas terminadas os las pondre aquí.

Salu2

P.D: La única documentación que proveeré, es referente a las funciones, explicando para que sirven, los parametros que necesitan y lo que devuelven. Quien quiera saber qué hace cada función por dentro... pues que aprenda PHP y Javascript XD.

De momento, ya va teniendo buena pinta esto, aunque todavía estoy capturando errores .

Teniendo todas las... librerías importadas, tanto los JavaScripts, como los PHP en el lado del servidor, con poco código (una línea), se pueden generar automáticamente listas desplegables (Selects), tablas, incluso si se tiene un DIV o campo de texto, también se puede rellenar.

Para que os hagais una idea de la sencillez a la que se puede llegar, os pongo este ejemplo:

genSelect(ControlID,MySQLQuery("root","root","localhost","SELECT username FROM realmd.account;","<F>","<C>",false));

genSelect, es una de las funciones del "kit", que es la encargada de generar los selects dinámicos.

Las otras 2 (de momento no he añadido más), se llaman genTable (para tablas), y fillText (para rellenar un campo Input o un DIV).

Pues, la funcion que os he puesto arriba, recibe los siguientes parámetros:

- ControlID

- MySQLQuery("root","root","localhost","SELECT username FROM realmd.account;"

- "<F>"
- "<C>"
- false

ControlID es el ID que se le pasa a la función, y corresponde al select que se quiere rellenar.

MySQLQuery es una función que envía una consulta mediante AJAX a una página PHP, el resultado que devuelve la función al final, es una tabla (Array). Realmente, en este parámetro, lo que necesita el genSelect que se le proporcione es un Array, por eso le meto la función directamente.

<F> y <C>, son los delimitadores para filas y columnas. Recordemos que, cuando PHP genere la tabla de resultados de MySQL, dicha tabla no se puede pasar tal cual a JavaScript, hace falta convertirla en una cadena, y para transformarla, hace falta colocar unos delimitadores para indicar qué valores pertenecen a columnas, y cuales a filas.

Los delimitadores pueden ser cualquier cosa, desde un simple caracter, hasta, como en este caso, cadenas.

Lo último, el false, indica si la petición por AJAX se va a hacer de manera asíncrona o síncrona (true para el primero, false para el segundo).

Yo para todo lo que son consultas, suelo hacerlas síncronas, para que se espere a que la página PHP devuelva la tabla resultante.


Pues, esta simple función, permite que de esto:

<Select id="cualquiercosa"></select>

Se pueda pasar a esto otro, sin hacer nada más:

<Select id="cualquiercosa">
<option dato1 ... >
<option dato2 ... >
<option dato3 ... >
....
</select>

¿No está mal verdad? , El select acabaría nutrido por todos los datos que hayan llegado en forma de tabla (lista en este caso) de la funcion genSelect.

Cuando tenga mas controlado errores y demás, os pondre el kit.

Salu2