ayuda autosuggest

[fguespe]

Tengo este form que quiero aplicacar en varias paginas para campso de texto con autosuggest.

Código PHP:

    <script type="text/javascript">window.onload=asignaVariables;</script>
            <form method="post" action="perfil.php">
                    <input type="text" id="input_2" class="auto_completar_campo" name="carrera" autocomplete="off" 
                    onfocus="if(document.getElementById('lista').childNodes[0]!=null && this.value!='') { filtraLista(this.value); formateaLista(this.value); 
                        reiniciaSeleccion(); document.getElementById('lista').style.display='block'; }" 
                    onblur="if(v==1) document.getElementById('lista').style.display='none';" 
                    onkeyup="if(navegaTeclado(event)==1) {
                        clearTimeout(ultimoIdentificador); 
                        ultimoIdentificador=setTimeout('rellenaLista()', 1000); }"/>
                 <input type="submit" name="cargarcarrera" value="aceptar" id="auto_completar_boton" class="color"/><br/>
             </form><div id="lista" onmouseout="v=1;" onmouseover="v=0;"></div><br/>  
  

Aparte tengo el arcihvo .js y el css que lo puse en el comentario de abajo.

El archivo .php

Código PHP:

  <?php
session_start(); 
mysql_connect("localhost","root","");
mysql_select_db("red social");
$usuario=$_SESSION['usuario'];
$fila_nombre=mysql_fetch_array(mysql_query("SELECT * FROM usuarios WHERE us_id='$usuario'"));
$facu=$fila_nombre["us_universidad"];

if(isset($_POST["busqueda"]))
{    

    $nombrelista="carreras";
    $nombrebusqueda="carr_titulo";
    $valor=$_POST["busqueda"];
    $consulta=mysql_query("SELECT * FROM ".$nombrelista." WHERE ".$nombrebusqueda." LIKE '".$valor."%' AND carr_id_facu='$facu' LIMIT 0, 22");    
    $nfila=mysql_num_rows($consulta);    
    mysql_close($coneccion);    
    if($nfila==0){
        /* 0: no se vuelve por mas resultados
        vacio: cadena a mostrar, en este caso no se muestra nada */
        echo "0&vacio";
    }else{
        if($nfila>20) echo "1&"; 
        else echo "0&";
        $nfila=1;
        while(($fila=mysql_fetch_array($consulta)) && $cantidad<=20)
        {
            echo "<div onClick=\"clickLista(this);\" onMouseOver=\"mouseDentro(this);\">".$fila["carr_titulo"]."</div>";
            // Muestro solo 20 resultados de los 22 obtenidos
            $nfila++;
        }
    }
}
?>   

Ahora, quiero aplicar el primer codigo en otras paginas como dije antes, pero cada pagina tiene que acceder a diferentes bases de datos y diferentes opciones y necesito alguna de manera de que estos archivos anden para todos y no tenga que crear archivos para cada autosuggest que quiero.

Pero no encuentra la mandera de pasar variables o lo que sea, no se me ocurre!!

Graicas!

[fguespe]

Aca el .js

Código PHP:

   
 
function asignaVariables() 
{ 
    // Funcion que asigna variables que se usan a lo largo de las funciones     
    v=1; nuevaBusqueda=1; busqueda=null; ultimaBusquedaNula=null; 
    divLista=document.getElementById("lista"); 
    inputLista=document.getElementById("input_2"); 
    elementoSeleccionado=0; 
    ultimoIdentificador=0; 
} 
 
 
function nuevoAjax() 
{  
    /* Crea el objeto AJAX. Esta funcion es generica para cualquier utilidad de este tipo, por 
    lo que se puede copiar tal como esta aqui */ 
    var xmlhttp=false;  
    try  
    {  
        // Creacion del objeto AJAX para navegadores no IE 
        xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");  
    } 
    catch(e) 
    {  
        try 
        {  
            // Creacion del objet AJAX para IE  
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");  
        }  
        catch(E) { xmlhttp=false; } 
    } 
    if (!xmlhttp && typeof XMLHttpRequest!="undefined") { xmlhttp=new XMLHttpRequest(); }  
 
    return xmlhttp;  
} 
 
function eliminaEspacios(cadena) 
{ 
    var x=0, y=cadena.length-1; 
    while(cadena.charAt(x)==" ") x++;     
    while(cadena.charAt(y)==" ") y--;     
    return cadena.substr(x, y-x+1); 
} 
 
function nuevoDato() 
{ 
    /* Funcion encargada del input de la izquierda. No interfiere para nada en la funcionalidad de 
    la lista desplegable */ 
    var divMensaje=document.getElementById("error"); 
    var inputIngreso=document.getElementById("input_1"); 
    var boton=document.getElementById("boton_1"); 
    var valor=inputIngreso.value; 
 
    // Reinicio las variables del input 2 
    inputLista.value=""; nuevaBusqueda=1; busqueda=null; ultimaBusquedaNula=null; 
 
    // Limpio posibles mensajes que haya en el div 
    divMensaje.innerHTML=""; 
 
    // Saco los espacios en blanco al comienzo y al final de la cadena 
    valor=eliminaEspacios(valor); 
     
    // Valido con una expresion regular el contenido de lo que el usuario ingresa 
    var reg=/(^[a-zA-Z0-9.@ ]{4,40}$)/; 
    if(!reg.test(valor))  
    { 
        divMensaje.innerHTML="El texto ingresado contiene caracteres o longitud inválida"; 
    } 
    else 
    { 
        // Deshabilito el boton y el input para evitar dobles ingresos 
        boton.disabled=true; inputIngreso.disabled=true; inputLista.disabled=true; 
        inputIngreso.value="Ingresando..."; 
     
        var ajax=nuevoAjax(); 
        ajax.open("POST", "auto_completar.php", true); 
        ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 
        ajax.send("ingreso="+valor); 
             
        ajax.onreadystatechange=function() 
        { 
            if (ajax.readyState==4) 
            { 
                // Borro el contenido del input 
                inputIngreso.value=""; 
                // Habilito campos y boton nuevamente 
                boton.disabled=false; inputIngreso.disabled=false; inputLista.disabled=false; 
                divMensaje.innerHTML=ajax.responseText; 
            } 
        } 
    } 
} 
 
function formateaLista(valor) 
{ 
    // Funcion encargada de ir colocando en negrita las palabras y asignarle un ID a los elementos 
    var x=0, verificaExpresion=new RegExp("^("+valor+")", "i"); 
     
    while(divLista.childNodes[x]!=null) 
    { 
        // Asigo el ID para reconocerlo cuando se navega con el teclado 
        divLista.childNodes[x].id=x+1; 
        // Coloco en cada elemento de la lista en negrita lo que se haya ingresado en el input 
        //divLista.childNodes[x].innerHTML=divLista.childNodes[x].innerHTML.replace(verificaExpresion, "<b>$1</b>"); 
        x++; 
    } 
} 
 
function limpiaPalabra(palabra) 
{ 
    // Funcion encargada de sacarle el codigo HTML de la negrita a las palabras 
    palabra=palabra.replace(/<b>/i, ""); 
    palabra=palabra.replace(/</b>/i, ""); 
    return palabra; 
} 
 
function coincideBusqueda(palabraEntera, primerasLetras) 
{ 
    /* Funcion para verificar que las primeras letras de busquedaActual sean iguales al 
    contenido de busquedaAnterior. Se devuelve 1 si la verificacion es afirmativa */ 
    if(primerasLetras==null) return 0; 
    var verificaExpresion=new RegExp("^("+primerasLetras+")", "i"); 
    if(verificaExpresion.test(palabraEntera)) return 1; 
    else return 0; 
} 
 
function nuevaCadenaNula(valor) 
{ 
    /* Seteo cual fue la ultima busqueda que no arrojo resultados siempre y cuando la cadena 
    nueva no comience con las letras de la ultima cadena que no arrojo resultados */ 
    if(coincideBusqueda(valor, ultimaBusquedaNula)==0) ultimaBusquedaNula=valor; 
} 
 
function busquedaEnBD() 
{ 
    /* Funcion encargada de verificar si hay que buscar el nuevo valor ingresado en la base 
    de datos en funcion de los resultados obtenidos en la ultima busqueda y en base a que 
    la cadena bsucada anteriormente este dentro de la nueva cadena */ 
    var valor=inputLista.value; 
     
    if((coincideBusqueda(valor, busqueda)==1 && nuevaBusqueda==0) || coincideBusqueda(valor, ultimaBusquedaNula)==1) return 0; 
    else return 1; 
} 
 
function filtraLista(valor) 
{ 
    // Funcion encargada de modificar la lista de nombres en base a la nueva busqueda 
    var x=0; 
 
    while(divLista.childNodes[x]!=null) 
    { 
        // Saco la negrita a los elementos del listado 
        divLista.childNodes[x].innerHTML=limpiaPalabra(divLista.childNodes[x].innerHTML); 
        if(coincideBusqueda(limpiaPalabra(divLista.childNodes[x].innerHTML), valor)==0) 
        { 
            /* Si remuevo el elemento x, el elemento posterior pasa a ocupar la posicion de 
            x, entonces quedaria sin revisar. Por eso disminuyo 1 valor a x */ 
            divLista.removeChild(divLista.childNodes[x]); 
            x--; 
        } 
        x++; 
    } 
} 
 
function reiniciaSeleccion() 
{ 
    mouseFuera();  
    elementoSeleccionado=0; 
} 
 
function navegaTeclado(evento) 
{ 
    var teclaPresionada=(document.all) ? evento.keyCode : evento.which; 
     
    switch(teclaPresionada) 
    { 
        case 40: 
        if(elementoSeleccionado<divLista.childNodes.length) 
        { 
            mouseDentro(document.getElementById(parseInt(elementoSeleccionado)+1)); 
        } 
        return 0; 
         
        case 38: 
        if(elementoSeleccionado>1) 
        { 
            mouseDentro(document.getElementById(parseInt(elementoSeleccionado)-1)); 
        } 
        return 0; 
         
        case 13: 
        if(divLista.style.display=="block" && elementoSeleccionado!=0) 
        { 
            clickLista(document.getElementById(elementoSeleccionado)) 
        } 
        return 0; 
         
        default: return 1; 
    } 
}     
 
function rellenaLista() 
{ 
    var valor=inputLista.value; 
 
    // Valido con una expresion regular el contenido de lo que el usuario ingresa 
    var reg=/(^[a-zA-Z0-9.@ ]{2,40}$)/; 
    if(!reg.test(valor)) divLista.style.display="none"; 
    else 
    { 
        if(busquedaEnBD()==0) 
        {     
            // Si no hay que buscar el valor en la BD 
            busqueda=valor; 
     
            // Hago el filtrado de la nueva cadena ingresada 
            filtraLista(valor); 
            // Si no quedan elementos para mostrar en la lista 
            if(divLista.childNodes[0]==null) { divLista.style.display="none"; nuevaCadenaNula(valor); } 
            else { reiniciaSeleccion(); formateaLista(valor); } 
        } 
        else 
        {     
            /* Si se necesita verificar la base de datos, guardo el patron de busqueda con el que se 
            busco y luego recibo en una variable si existen mas resultados de los que se van a mostrar */ 
            busqueda=valor; 
 
            var ajax=nuevoAjax(); 
            ajax.open("POST","auto_completar.php?", true); 
            ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 
            ajax.send("busqueda="+valor); 
         
            ajax.onreadystatechange=function() 
            {     
                if (ajax.readyState==4) 
                { 
                    if(!ajax.responseText) { divLista.style.display="none"; } 
                    else  
                    { 
                        var respuesta=new Array(2); 
                        respuesta=ajax.responseText.split("&"); 
                 
                        /* Obtengo un valor que representa si tengo que ir a BD en las proximas  
                        busquedas con cadena similar */ 
                        nuevaBusqueda=respuesta[0]; 
                 
                        // Si se obtuvieron datos los muestro 
                        if(respuesta[1]!="vacio")  
                        {  
                            divLista.style.display="block"; divLista.innerHTML=respuesta[1];  
                            // Coloco en negrita las palabras 
                            reiniciaSeleccion(); 
                            formateaLista(valor);  
                        } 
                        // En caso contrario seteo la busqueda actual como una busqueda sin resultados 
                        else nuevaCadenaNula(valor); 
                    } 
                } 
            } 
        } 
    } 
} 
 
function clickLista(elemento) 
 
{ 
    /* Se ejecuta cuando se hace clic en algun elemento de la lista. Se coloca en el input el 
    valor del elemento clickeado */ 
    v=1; 
    valor=limpiaPalabra(elemento.innerHTML);  
    busqueda=valor; inputLista.value=valor; 
    divLista.style.display="none"; elemento.className="normal"; 
} 
 
function mouseFuera() 
{ 
    // Des-selecciono el elemento actualmente seleccionado, si es que hay alguno 
    if(elementoSeleccionado!=0 && document.getElementById(elementoSeleccionado)) document.getElementById(elementoSeleccionado).className="normal";  
} 
 
function mouseDentro(elemento) 
{ 
    mouseFuera(); 
    elemento.className="auto_completar_resaltado"; 
    // Establezco el nuevo elemento seleccionado 
    elementoSeleccionado=elemento.id; 
}  
   

Y el css.

Código PHP:

  @charset "utf-8"; 
.auto_completar_campo {  
    position:relative; 
    float:left; 
    width:300px;  
    height:11px; 
    font-size:10px; 
    border-style:solid; 
    border-width:1px; 
} 
#lista{ 
    position:relative; 
    float:left; 
    width:300px; 
    background-color:#FFF; 
    color:#000;  
    border-style:solid; 
    border-width:1px; 
    border-top-width:0px; 
    z-index:1; 
    display:none; 
} 
.auto_completar_resaltado{ 
    background-color:#eb6869; 
    color:#FFF; 
    cursor:pointer; 
} 
#auto_completar_boton{ 
    position:relative; 
    float:left; 
    height:15px; 
    text-align:center; 
    color:#FFF; 
    font-size:10px; 
    font-family:Tahoma, Geneva, sans-serif; 
    border-style:solid; 
    border-width:0; 
    margin-left:5px; 
     
}