buenas amigos del foro,...
Tengo el siguiente código...
index.php
Código javascript
:
Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript">
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 detectkey(evt,obj) {
keycode = (evt.keyCode==0) ? evt.which : evt.keyCode;
if (keycode!=8) {
cadena=obj.value + String.fromCharCode(keycode);
pagina='filtra.php?cadena='+cadena;
}else {
obj.value="";
pagina='filtra.php';
}
divcontenido = document.getElementById('tabla_usuarios');
ajax=objetoAjax();
ajax.open("POST", pagina, true);
ajax.onreadystatechange=function() {
if (ajax.readyState==4) {
divcontenido.innerHTML = ajax.responseText
}
}
ajax.send(null);
}
</script>
</head>
<body>
<input type="text" name="nom" id="nom" value="" size="30" maxlength="30" onkeypress="detectkey(event,this)">
<br />
<div id="tabla_usuarios"></div>
</body>
</html>
filtra.php
Código php:
Ver original<?PHP
if (isset($_REQUEST['cadena'])) { $_REQUEST['cadena'];
$query="SELECT nombre,apellido FROM usuarios WHERE (nombre like 'cadena%')";
}else $query="SELECT nombre,apellido FROM usuarios";
or
die ("No se puede conectar con el servidor");
or
die ("No se puede seleccionar la base de datos");
?>
<TABLE>
<TBODY>
<TR>
<TH>Nombre</TH>
<TH>Apellido</TH>
</TR>
<?PHP
echo "<TR>";
echo "<TD>".$row['nombre']."</TD>";
echo "<TD>".$row['apellido']."</TD>";
echo "</TR>";
}
?>
</TBODY>
</TABLE>
La función del código es la siguiente:
Al abrir index.php el navegador presenta un textfield. Cuando tu ingresas un caracter en él, por medio del evento onkeypress, se realiza una petición al servidor mandándole el contenido del textfield. Con esta cadena el servidor realiza un select a una tabla, monta un <table> con el resultado de la consulta y lo envia al cliente que lo inserta en el <div id="tabla_usuario">. El script funciona correctamente y si la consulta anda rapìda parece que estemos haciendo un filtro en el momento.
El problema esta en que realiza una petición por cada tecla que se pulsa y pienso que esto no debe ser muy eficiente.
¿Existiría alguna forma de ir matando los procesos ajax anteriores? es decir, que cuando pulsemos la segunda tecla abortemos la 1ª petición, cuando pulsemos la 3ª vez abortemos la 2ª, y asi sucesivamente teniendo sólo en ejecución la última petición.
No se si abrá alguna solución para esto pero llevo días dándole vueltas y no he dado con nada. Va a ser que se me queda grande...
Muchisimas gracias solamente por leerme y si me hechan un cable pues más gracias aun...
Saludos
