Este foro ya no está activo, así que no puedes publicar nuevas preguntas ni responder a las preguntas existentes.

¿Cómo le puedo asignar un dataset a un selectBox de los componentes de Bootstrap?

13 de noviembre de 2013

Cómo le puedo asignar un dataset a un selectBox de los componentes de Bootstrap? Y de la misma manera, ¿cómo se lo asigno a la mayoría de los componentes? Porfa, me urge, de antemano gracias.


Respuestas

#1

@GoanMalachi, si he entendido bien tu pregunta, creo que necesitas utilizar el plugin typeahead.js. En primer lugar tienes que tener en cuenta que este plugin ya no está disponible en Bootstrap 3, por lo que tendrás que utilizar Bootstrap 2.

Para utilizarlo, en primer lugar enlaza en tu página el código de JQuery y el del propio plugin:

<script src="js/jquery.js"></script>
<script src="js/bootstrap-typeahead.js"></script>

Después, añade el atributo data-source a cualquier <input> de tipo texto y ya tendrás el autocompletado listo para usar:

<input type="text" data-provide="typeahead"
       data-source='["Elemento 1", "Elemento 2", "...", "Elemento N"]'>

El valor más sencillo posible del atributo data-source es un array de cadenas de texto, tal y como se muestra en este ejemplo. Ten en cuenta que el valor debe ser una cadena JSON válida, por lo que las cadenas hay que encerrarlas con comillas dobles.

Si tu autocompletado es más complejo (por ejemplo tiene miles de elementos) entonces es mejor que utilices como valor de data-source una función. El texto que escribe el usuario se pasa automáticamente a la función como primer argumento.

También es aconsejable que añadas el atributo autocomplete="off" al campo de texto para evitar que los navegadores intenten autocompletar el valor del campo.

Por último, te aconsejo que consultes la documentación oficial de este plugin, ya que dispones de muchas más opciones de configuración (el máximo número de elementos que se muestra en la lista, el mínimo número de letras que hay que escribir para activar el autocompletado, etc.)

@javiereguiluz

13 noviembre 2013, 10:33