Hola, quería preguntar si alguien tiene un buen código de lo que yo llamo 'escritura intuitiva', esto es, yo escribo algo en un cuadro de texto y en un select al lado me aparecen las opciones que cuadran con lo que estoy escribiendo. Si elijo alguna de las opciones, una serie de cuadros de texto se completan automáticamente.
Tengo hecho un código para hacer esto pero es bastante mejorable aunque no acabo de encontrar la forma de hacerlo:
Este php recoge los datos de la BBDD (todo OK)
Código PHP:
<?
//Connecto amb la BBDD
$link = mysql_connect("localhost", "root");
mysql_select_db("baseDATOS", $link);
//Array de clients x escriptura intuitiva
$arClients = array(); //Creo l'array
$it = 0; //Iterador
$cercaClients = mysql_query("SELECT * FROM llista");
//Provarem amb JavaScripts...
echo "<script language=javascript> ";
echo "var miArray = new Array(); ";
while($cerca=mysql_fetch_array($cercaClients)){
$chupi = $cerca['titol'];
$nomcomercial = $cerca['interpret'];
$nif = $cerca['companyia'];
$arClients[$it] = $chupi;
echo "miArray[".$it."] = new Array(3); ";
echo "miArray[".$it."][0] = '".$chupi."'; ";
echo "miArray[".$it."][1] = '".$nomcomercial."'; ";
echo "miArray[".$it."][2] = '".$nif."'; ";
$it++;
}
echo "</script>";
?>
Este el JavaScript que se encarga de comprobar lo que escribo, con qué elementos de la lista anteriormente generada coincide, si coincide lo añade como Option al Select, etc... X cierto, la llamada a la función intuitif() se hace en el cuadro de texto 'rsocial' con el evento onKeyUp, y la llamada a la función posaTot() en el select llamado 'posar' con el evento onChange.
Código:
<!-- ESCRIPTURA INTUITIVA -->
<script language="JavaScript">
function intuitif() {
var x;
x = contracte2.rsocial.value;
//window.alert('x: ' + x);
if(x == ""){
contracte2.nomcom.value = "";
contracte2.nif.value = "";
contracte2.dsocial.value = "";
var it = 0;
for(it=0;it<=miArray.length;it++){
contracte2.posar.options[it] = null;
}
}
xm = x.toLowerCase();
contracte2.posar.disabled = false;
//variable = new Option("","","","");
//contracte2.posar.options[0] = variable;
var it = 1;
for(it=1;it<=miArray.length;it++){
//window.alert('it: ' + it);
y = miArray[it-1][0];
yK = String(y);
yP = yK.toLowerCase();
yKiero = yP.substring(0,x.length);
window.alert('yKiero: ' + yKiero);
if(x == yKiero){
var it = 0;
for(it=0;it<=miArray.length;it++){
contracte2.posar.options[it] = null;
}
variable = new Option(yK,yK,"","")
window.alert('variable: ');
contracte2.posar.options[it] = variable;
} else{
contracte2.posar.options[it] = null;
contracte2.nomcom.value = "";
contracte2.nif.value = "";
contracte2.dsocial.value = "";
}
}
}
function posaTot(){
minteressa = contracte2.posar.options[contracte2.posar.selectedIndex].value;
for(m=0;m<miArray.length;m++){
if(miArray[m][0] == minteressa){
aketa = m;
}
}
contracte2.nomcom.value = miArray[aketa][0];
contracte2.nif.value = miArray[aketa][1];
contracte2.dsocial.value = miArray[aketa][2];
}
</script>
En fin, que si alguien tiene algo que me pueda servir sería fantástico, y si no pues ahí queda el código para quien le pueda sacar algún provecho