Dos jQuery typeahead (autocompletar) independientes el uno del otro

[kamita]

Hola!

A ver si me podéis ayudar con esta.... quiero poner en un formulario dos campos, uno para la provincia y otro para la localidad, independientes el uno del otro, ambos con la función autocompletar, es decir que empiezo en el primero escribo Madrid, que se me sugiere mientras tecleo. Me voy al segundo campo y según voy escribiendo me va sugiriendo pueblos de la Comunidad de Madrid.

Para hacerlo quería utilizar el TypeAhead plugin de Twitter Bootstrap, ya que me ha parecido bastante sencillo y claro.

Para poner un campo tengo que poner esto (ademas del ondocumentready):

Código HTML:

<input type="text" data-provide="typeahead" data-items="4" data-source='["Madrid","Toledo","Segovia","Avila","Cuenca","Guadalajara","Burgos","Leon","Valladolid"]'> 

Se os ocurre como puedo hacer que el segundo campo tenga distintos sources en función del primero? Gracias.

[kamita]

Hola. He hecho avances. Ahora solo tengo me teneis que ayudar a una cosa muy simple. Alguien me puede decir el código javascript necesario para introducir una opción a una etiqueta html input?

Es decir...tengo

Código HTML:

<input type="text" data-provide="typeahead" data-items="4" > 

y tengo antes que esa opción, un seleccionable, que cuando cambia activa un javascript, que tiene un switch entre sus opciones...y lo que quiero es que si estamos en el switch en el case 1 me introduzca esto en la etiqueta input como parametro al final de todas las opciones.

Código:

data-source="["Alcala de Henares", "Alcobendas", "Alcorcon", "Aldea del Fresno", "Aranjuez", "Arganda del Rey", "Arroyomolinos", "Batres", "Boadilla del Monte", "Brunete", "Casarrubuelos", "Chinchon", "Ciempozuelos", "Coslada", "Cubas de la Sagra", "El Alamo", "Fuenlabrada", "Getafe", "Griñon", "Humanes de Madrid", "Las Rozas", "Leganes", "Madrid", "Majadahonda", "Mejorada del Campo", "Moraleja de Enmedio", "Morata de Tajuña", "Mostoles", "Navalcarnero", "Parla", "Pinto", "Pozuelo de Alarcon", "Quijorna", "Rivas Vaciamadrid", "San Fernando de Henares", "San Martin de la Vega", "San Sebastian de los Reyes", "Serranillos del Valle", "Sevilla la Nueva", "Titulcia", "Torrejon de Ardoz", "Torrejon de la Calzada", "Torrejon de Velasco", "Valdemoro", "Velilla San Antonio", "Vicalvaro", "Villaconejos", "Villamanta", "Villamantilla", "Villanueva de la Cañada", "Villanueva de Perales", "Villaviciosa de Odon"]"

Gracias

[garciasanchezdani]

Hola kamita
Creo que puedes hacerlo con jQuery.

Primero de todo, sería bueno dar un id al input:

Código HTML:

<input id="campoautocompletar" type="text" data-provide="typeahead" data-items="4" >
 

Segundo, accedes a este input, y le añades el atributo que quieres:

Código Javascript:

$('#campoautocompletar').attr('data-source', '["Alcala de Henares", "Alcobendas", "Alcorcon", "Aldea del Fresno", "Aranjuez", "Arganda del Rey", "Arroyomolinos", "Batres", "Boadilla del Monte", "Brunete", "Casarrubuelos", "Chinchon", "Ciempozuelos", "Coslada", "Cubas de la Sagra", "El Alamo", "Fuenlabrada", "Getafe", "Griñon", "Humanes de Madrid", "Las Rozas", "Leganes", "Madrid", "Majadahonda", "Mejorada del Campo", "Moraleja de Enmedio", "Morata de Tajuña", "Mostoles", "Navalcarnero", "Parla", "Pinto", "Pozuelo de Alarcon", "Quijorna", "Rivas Vaciamadrid", "San Fernando de Henares", "San Martin de la Vega", "San Sebastian de los Reyes", "Serranillos del Valle", "Sevilla la Nueva", "Titulcia", "Torrejon de Ardoz", "Torrejon de la Calzada", "Torrejon de Velasco", "Valdemoro", "Velilla San Antonio", "Vicalvaro", "Villaconejos", "Villamanta", "Villamantilla", "Villanueva de la Cañada", "Villanueva de Perales", "Villaviciosa de Odon"]');
 

Algo parecido podría servir...
Para más información, aquí puedes encontrar ejemplos del uso de attr: http://api.jquery.com/attr/

Saludos, Daniel