Ajout d'un bouton de liste déroulante à Twitter bootstrap typeahead component

Twitter bootstrap est livré avec un outil très pratique de l'auto-complétion comme composant appelé typeahead. Je suis en train d'ajouter un petit bouton de la liste déroulante (ou widget) de telle sorte que lorsqu'il est pressé le typeahead composant agirait comme un normal déroulant le sélecteur affichant toutes les données disponibles source lié options (en plus de ses natif de saisie semi-automatique capacité). Le marquage en cours est quelque chose comme ce qui suit:

<input type="text" 
       data-provide="typeahead"
       data-items=5
       data-source='["option 1","option 2","option 3"]'>

Donc en effet ce qui est nécessaire est que le composant se comporte comme un hybride d'une liste déroulante et la saisie semi-automatique des widgets.
Quelqu'un l'a fait avant? merci...

source d'informationauteur Rabih Kodeih

  1. 15

    J'ai trouvé cet excellent componnet:

    Le code Source

    Live exemple

    Une chose, le bouton déroulant de l'arrière-plan semble drôle au survol. Le correctif consiste à un petit changement dans le "bootstrap-zone de liste déroulante.css":

    ...
.combobox-container .add-on {
    float: left;
    display: block;
    width: auto;
    min-width: 16px;
    height: 18px;
    margin-right: -1px;
    padding: 4px 5px;
    font-weight: normal;
    line-height: 18px;
    color: #999999;
    text-align: center;
    text-shadow: 0 1px 0 #ffffff;
    /*   background-color: #f5f5f5; */ //<<------------ comment this line
    border: 1px solid #ccc;
    -webkit-border-radius: 3px 0 0 3px;
    -moz-border-radius: 3px 0 0 3px;
    border-radius: 3px 0 0 3px;
}
...
  2. 5

    Carburant UX ainsi offre une zone de liste déroulante basée sur Bootstrap.