autocompletador mostrado en una tabla

jimi · #1 (**permalink**) 14/05/2006, 20:35

Hola a todos, paso a explicar mas o menos lo que ando buscando:
Tengo un campo input text, para llenarlo con el nombre de un usario.
La idea es que mientras va agregando caracteres al input, se veo en una tabla los resultados intermedios con un limite de 10, por ejemplo..
O sea que si ingresa la pe, que en la tabla le muestre los primeros 10 usuarios cuyo nombre empieza con la pe..
Si sigue y escribe perez que le muestre en la tabla todos los perez de la bd..

Vi por ahi un codigo parecido pero no lo mostraba en una tabla, y la verdad es que no entiendo mucho de ajax, y cambiar ese codigo se me hace jodidisimo..

Saludos, y gracias de antemano

augusto_jaramil · #2 (**permalink**) 17/05/2006, 08:43

Que tal jimi

Creo que tengo lo que necesitas... te envio apartes del script que tengo para eso

en el head:

Código PHP:

  <script language="javascript"> 
/*Function global de AJAX*/ 
function ajaxLoader(url,id)     { 
        if (document.getElementById) { 
                var x = (window.ActiveXObject) ? new ActiveXObject("Microsoft.XMLHTTP") : 
new XMLHttpRequest(); 
        } 
        if (x){ 
                x.onreadystatechange = function(){ 
                        if (x.readyState == 4 && x.status == 200){ 
                                el = document.getElementById(id); 
                                el.innerHTML = x.responseText; 
                        } 
                } 
 
                x.open("GET", url, true); 
                x.send(null); 
        } 
} 
 
function LoadClien() { 
        if (document.getElementById('nombre').value != '') { 
           document.getElementById('Clien').style.display=''; 
           document.getElementById('Clien').innerHTML=''; 
           clien = document.getElementById('nombre').value.toUpperCase(); 
           ajaxLoader('buscar/wclienx.php?nom='+clien,'Clien'); 
        } else { 
           document.getElementById('Clien').style.display='none'; 
           document.getElementById('Clien').innerHTML=''; 
        } 
} 
 
function Get_Clien(val,val1) { 
        document.getElementById('nit').value    = val; 
        document.getElementById('nombre').value = val1; 
        document.getElementById('Clien').style.display='none'; 
        document.getElementById('Clien').innerHTML=''; 
} 
</script>

En <html> (los input text)

Código PHP:

 
<body> 
..... 
  <td><b>Cliente:<font color=#ff00000></td><td> 
 
          <input type=text value='<? echo trim($mat_movih['nit']) ?>' name='nit' id='nit' size=10 style='width: 90;'  onkeypress='return handleEnter(this, event)'></td> 
 
          <td><input type=text value='<? echo trim($mat_movih['nombre']) ?>' name='nombre' id='nombre' size=10 onKeyUp='LoadClien();' style='width: 270;' onkeypress='return handleEnter(this, event)'> <div id="Clien" style="display:none; width: 300;"> </div></td><tr> 
 
..... 
 
</body> 
</html>

en el buscador de php (buscar/wclienx.php) luego de realizar el query (el resultado del query lo obtengo en una matriz bidimensional asociativa)

Código PHP:

   
..... 
$respuesta = ""; 
for ($j=0; $j<count($resultado); $j++) { 
    extract($resultado[$j]); 
    $respuesta = "'".strToUpper(trim($nit))."','".strToUpper(trim($nombre))."'"; 
   echo "<P><a href='javascript:;' OnClick=\"Get_Clien(".$respuesta.")\">".strToUpper(trim($nombre))."</a></P>"; 
} 
?>

Aun lo tengo encuarentenado por la forma arcaica como lo estoy haciendo

. Muy seguramente existe una forma de optimizarlo... estoy trabajando en eso

Espero te sirva

Un Cordial Saludo

augusto_jaramil · #3 (**permalink**) 17/05/2006, 09:28

Con respecto a los scripts estos.... alguien conoce alguna forma de que la respuesta no la mande a un <div>, tal vez depronto a un layer... no se. El lio es que en una forma que contiene varias filas, por ejemplo 5, 6 o mas... al mostrar los resultados me despaza las filas de la forma y esteticamente no resulta como muy agradable que digamos.

Otra cosita jovenes aun, Como puedo lograr que cuando la consulta me devuelva solo un registro no haya necesidad de seleccionarlo de la lista, si no que automaticamente me llene los campos requeridos?

Un Cordial Saludo a todos

jimi · #4 (**permalink**) 18/05/2006, 23:57

Gracias pibe!!!
anduvo fenomeno, quedo joyita..
Le hice un par de cambios, en forma de mostrarlo, ahora si se ve una tabla va mostrando los resultados intermedios.. Le puse que mostrara hasta un limite de 7 filas.. anda barbaro.
Si lo queres ver esta en mi pagina, que es la que use para probarlo, y deje un link para descargar el codigo fuente.

puntovista.com.ar/ajax/ajax_tabla_autorecargable/clientes.php

rivert · #5 (**permalink**) 19/05/2006, 11:29

JIMI
Dale una chequeada a este link
formatoweb.com.ar/ajax/
el amigo zaqpz me lo facilito unos meses atras.

Saludos

augusto_jaramil · #6 (**permalink**) 19/05/2006, 13:18

Que Tal Don jimi

Ahi estuve visitando la pagina de pruebas que indicas.... quedo vacana mano.....

Hay tres cositas que te comento:
1. Al picar en un check me aparece este error: do_an_e is not defined... Archivo de origen: http://www.forosdelweb.com/clientscr...lletin_menu.js Linea 622 y hasta ahi llega.

2. El enlace http://www.formatoweb.com.ar/ar no puedo acceder a esa pagina... queda en blanco la pantalla

3. Como descomprimo el archivo *.rar en un sistema Linux

Un cordial Saludo