2013-11-15 3 views
2

Я пытаюсь вывести список значений через привязку данных в раскрывающемся списке Bootstrap Twitter.Добавление привязки данных к выпадающему списку Bootrstrap

<div class="btn-group"> 
      <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> 
      Action <span class="caret"></span> 
      </button> 
      <ul class="dropdown-menu" role="menu" data-bind="options: artists, optionsText: 'name', optionsValue: 'id', value:selectedArtistId"> 
      <li></li> 
      </ul> 
</div> 

я наткнулся на Knockout_bootstrap JS, но я не уверен, что он работает с падения падения

http://billpull.github.io/knockout-bootstrap/

(пример не приводится)

ответ

3

Список HTML против HTML Выбор
бутстрапом dropdown - это список html.

<ul> 
    <li></li> 
</ul> 

options binding нокаута JS является обязательным для HTML select элементов.

<select> 
    <option></option> 
</select> 

Я не могу точно сказать, что вы хотите сделать, но то, что вы сейчас делаете, добавляя опции нокаута обязательные к <ul>, когда связывание должно быть для <select>.

Живой пример в JS бен
Вот exmaple в jsbin, который использует нокаут для связывания в обоих сценариях.

http://jsbin.com/ITOZUPI/1/edit

часть HTML с kò данных креплениями

<div class="btn-group"> 
    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> 
      Action <span class="caret"></span> 
      </button> 
    <ul class="dropdown-menu" role="menu" data-bind="foreach: my.VM.Artists"> 
    <li><a role="menuitem" tabindex="-1" href="#" data-bind="text: artistName, click: getTheArtist"></a></li> 
</ul> 
</div> 

    <p>&nbsp;</p> 

    <select data-bind="options: my.VM.Artists, 
       optionsCaption: 'Please select an Artist...', 
       optionsText: 'artistName', 
       optionsValue: 'artistId', 
       value: my.VM.artist_selected"></select> 
Смежные вопросы