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 tabla pequeñ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 las funciones en javascript
Ahora escribiremos 2 funciones, en la primera ( objetoAjax ) tiene como objetivo elegir el objeto XMLHttpRequest dependiendo del navegador, y la segunda función ( MostrarConsulta(parametro) ) tendrá como objetivo pedir los datos y mostrarlos en una capa (<div>) que especificaremos. Estas funciones lo podemos incluir en un archivo javascript (.js) al cual llamaremos ajax.js
ajax.js
function objetoAjax(){
var xmlhttp=false;
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
xmlhttp = false;
}
}
if (!xmlhttp && typeof XMLHttpRequest!='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
<?php
//Configuracion de la conexion a base de datos
$bd_host = "localhost";
$bd_usuario = "root";
$bd_password = "";
$bd_base = "ribosomatic";
$con = mysql_connect($bd_host, $bd_usuario, $bd_password);
mysql_select_db($bd_base, $con);
//consulta todos los empleados
$sql=mysql_query("SELECT * FROM empleados",$con);
//muestra los datos consultados
echo "</p>Nombres - Departamento - Sueldo</p> n";
while($row = mysql_fetch_array($sql)){
echo "<p>".$row['nombres']." - ".$row['departamento']." - ".$row['sueldo']."</p> n";
}
?>
Formulario de consulta
Finalmente creamos un archivo html que contendrá un Form y un Button el cual realizará la consulta.
consulta_empleados.html
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Consulta Registro con AJAX</title>
<!-- referenciamos al archivo ajax.js donde se encuentra nuestra funcion objetoAjax-->
<script language="JavaScript" type="text/javascript" src="ajax.js"></script>
</head>
<body>
<p>Consultar registros con ajax</p>"</p>"<p><!-- En "onsubmit" escribimos la función 'MostrarConsulta' que creamos en javascript, con su parametro que es el archivo que vamos a mostrar, en este caso 'consulta.php'-->
<form name="consulta" action="" onsubmit="MostrarConsulta('consulta.php'); return false"> <label>
<input type="submit" value="Consultar" />
</label>
</form>
<div id="resultado"></div>
</body>
</html>
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.
Como podrán apreciar el código es realmente sencillo de entender, aún así daré mas detalles si preguntan. Pueden descargar el archivo si desean. Hasta otra oportunidad.
hola mi pregunta es como puedo hacer el llamado de los registros colocando por ejemplo el id del empleado en la tabla cliente? porfa responde a mi correo andres_gabriel_124@hotmail.com y gracias
Como se haria con procedimientos almacenados espero tu respuesta, probe el ejemplo tal y como dices salio bien
alguien tiene algo relacionado con gestion de notas, para una institucion, estoy desarrollando algo, pero debe tener en cuenta
1 el programa
2 el semestre
3 el alumno
si alguien tiene algo que me pueda servir, gracias.
Hola, muy buen ejemplo ehhh!!
Hola, me gustaria saber como puedo hacer la busqueda dando un parametro en la consulta, algo asi:
$sql=mysql_query("SELECT * FROM empleados WHERE idempleado=5",$con);
si funciona pero si cambio asi:
$sql=mysql_query("SELECT * FROM empleados WHERE idempleado='$id'",$con);
ya no hace nada, la variable la tomo desde consulta_empleados.html pero no me pasa el valor.
Cual sera mi problema. Gracias y saludos
Requiero un ejemplo de lo siguiente:
Al escribir el numero de cedula en un campo, automaticamente me traiga uno o varios datos de la tabla de la base de datos en el mismo formulario, me puedes colaborar, Gracias de antemano.
Holas compas.. queria que porfavor me ayuden, necesito saber como hacer dos o mas bases de datos que cuando le llame a un usuario X me de toda la información de este...
hola..muy buen script ..peor imagina ke si kiero havcer una consulta con u paranetro dado por el usuario y ke el script funcione de la misma manera.. como le hago para mandar el parametro para ke sea ejecutado en la coonsulta sql....(consulta.php)
Por fa esto es importante..me gustaria saber como se hace
GRAX...
Hola que tal crees que puedas tocar el tema de mvc en php me estoy metiendo es ese tema pero aun tengo dudas! gracias
HOla amigo Tengo un boton buscar y unas cajas de texto, busco por la tarjeta de identificacion y luego se me coloco los resultados en la cajas de texto, como hago esto con ajax? puedes responderme o colocar un ejemplo de esto, bueno muchas gracias mantenme al tanto de tu respuesta mandando un msj a mi correo. porfavor. jairj02@yahoo.es