2

我试图通过数据绑定将值列表拉入 Twitter Bootstrap 下拉列表。

<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/

(未提供示例)

4

1 回答 1

3

HTML 列表与 HTML 选择
引导下拉列表是一个 html 列表。

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

淘汰赛 jsoptions绑定是对 htmlselect元素的绑定。

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

我无法确定您想要做什么,但您当前正在做的是将敲除选项绑定添加到 a <ul>,而该绑定应该用于 a <select>

JS Bin 中的实时示例
这是 jsbin 中的一个示例,它在两种情况下都使用敲除进行绑定。

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

带有 ko 数据绑定的 HTML 的一部分

<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>
于 2013-11-15T01:50:55.313 回答