我试图通过数据绑定将值列表拉入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/
(未提供示例)
答案 0 :(得分:3)
HTML列表与HTML选择
引导下拉列表是一个HTML列表。
<ul>
<li></li>
</ul>
淘汰赛js options
binding是对html select
元素的绑定。
<select>
<option></option>
</select>
我无法确定您想要做什么,但您目前正在做的是将绑定选项绑定到<ul>
,当绑定应该用于<select>
。
JS Bin中的实例
以下是jsbin中的一个例子,它在两种情况下都使用knockout进行绑定。
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> </p>
<select data-bind="options: my.VM.Artists,
optionsCaption: 'Please select an Artist...',
optionsText: 'artistName',
optionsValue: 'artistId',
value: my.VM.artist_selected"></select>