Вопрос по twitter-bootstrap – Добавление выпадающей кнопки в компонент начальной загрузки Twitter

14

Загрузчик Twitter поставляется с очень удобным автозаполняемым компонентом, который называется typeahead. Я пытаюсь добавить небольшую выпадающую кнопку (или виджет), чтобы при нажатии компонент typeahead работал как обычный выпадающий селектор, отображающий все доступные параметры привязки к источнику данных (в дополнение к его собственной способности автозаполнения). Текущая разметка выглядит примерно так:

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

Таким образом, в действительности, компонент должен вести себя как гибрид выпадающих виджетов и виджетов автозаполнения. Кто-нибудь делал это раньше? Спасибо...

Ваш Ответ

2   ответа
15

Исходный код
Живой пример

Одна вещь, однако, фон раскрывающейся кнопки выглядит забавно при переключении. Исправление включает небольшое изменение в "bootstrap-combobox.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;
}
...
Я пытался использовать это, но после преобразования в комбинированный список вы больше не можете привязываться к событию изменения jquery.
5

обеспечивает Combobox на основе Bootstrap.

Похожие вопросы