Ajax

AJAX, PHP, MySQL - Consulta de registros

Realizaremos un sencillo ejemplo de como recuperar registros de una tabla con AJAX.
Este ejemplo lo he probado en IE, Firefox, Opera y Netscape sin darme errores.
Es un ejemplo sencillo si estamos familiarizados con PHP y MySQL.Aún así dare algunas explicaciones generales sobre el código.

Creacion de la tabla

Entonces empezemos creando un tablapequeña llamada empleados, no tendrá mas que 5 campos: idempleado, nombres, departamento y sueldo; además insertaremos algunos datos.
CREATE TABLE empleados (  
                idempleado int NOT NULL auto_increment,
                nombres varchar(32) NOT NULL,
                departamento varchar(40)NOT NULL,
                sueldo double,
                KEY id(idempleado) )
TYPE=MyISAM;   

INSERT INTO empleados VALUES (1, 'Juan Perez', 'Informatica',500.00);
INSERT INTO empleados VALUES (2, 'Laura Morales', 'Contabilidad',550.00);
INSERT INTO empleados VALUES (3, 'Luis Gutierrez', 'Administracion',850.00);
INSERT INTO empleados VALUES (4, 'Pedro Solar', 'Informatica',500.00);
INSERT INTO empleados VALUES (5, 'David Vilchez', 'Contabilidad',550.00);

Creamos lasfunciones en javascript

Ahora escribiremos 2 funciones, en la primera ( objetoAjax ) tiene como objetivo elegir el objetoXMLHttpRequest dependiendo del navegador, y la segunda función ( MostrarConsulta(parametro)) tendrá como objetivo pedir los datos y mostrarlos en una capa () que especificaremos. Estas funciones lo podemos incluir en un archivo javascript (.js) al cual llamaremos ajax.js
ajax.jsfunction objetoAjax(){
        var xmlhttp=false;
        try {
                xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
                try {
                   xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
                } catch (E) {
                        xmlhttp = false;
                }
        }

        if (!xmlhttp && typeofXMLHttpRequest!='undefined') {
                xmlhttp = new XMLHttpRequest();
        }
        return xmlhttp;
}

function MostrarConsulta(datos){
        divResultado = document.getElementById('resultado');
        ajax=objetoAjax();
        ajax.open("GET", datos);
        ajax.onreadystatechange=function() {
                if (ajax.readyState==4) {
                        divResultado.innerHTML =ajax.responseText
                }
        }
        ajax.send(null)
}

Pedir los datos con PHP

En esta parte escribiremos un script en PHP para realizar una consulta de todos los registros de la tabla empleados en la base de datos.
consulta.php

Formulario de consulta

Finalmente creamos un archivo html que contendrá un Form y un Button el cual realizará la consulta.consulta_empleados.html

   

   

    Consulta Registro con AJAX

 

   

   

   

    Consultar registros con ajax""

   

 

 

 

 

 

 

En resumen

Para consultar los datos de una tabla hemos realizado lo siguiente:
▪ Una función para crear el objeto XMLHttpRequest dependiendo del navegador.
▪ Una función que realizará la petición de datos e indicarádonde se mostrarán estos.
▪ Una script en PHP que consulta los datos y los muestra.
▪ Y finalmente el formulario de consulta.

Introducción a AJAX con PHP y formularios

Desde que Gmail apareció, ha cambiado la forma de ver la web. Hoy sabemos que podemos hacer un sitio completo sin la necesidad de recargar la página y sólo cargando las partes que requerimos. La tecnología usada es elXMLHTTPREQUEST, bautizada recientemente con el nombre de AJAX. A manera de ejercicio veremos primero cómo cargar contenido, después cómo interactuar con php y mandar pequeñas porciones de información y finalmente cómo enviar información más grande.

Creando el objeto XMLHTTPREQUEST

Hacer una función genérica es la mejor idea para este modelo. A base de try y catch podemos hacer una función...