我试图在表格上显示具有相同值和功能的相同select
。我使用foreach
绑定绑定到我的表对象。这是我的代码:
<table class="table table-bordered" >
<thead>
<tr>
<th>Nextable Name</th>
<th>POS Name</th>
</tr>
</thead>
<tbody data-bind="foreach: tables">
<tr>
<td data-bind="text: name"></td>
<td><select class="select2 span8 dropdown" data-placeholder="Select Pos Table" data-bind="options: $parent.omnivoreTables, optionsText: 'name', optionsValue:'id', value: $parent.selectedOmnivoreTableId"></select></td>
</tr>
</tbody>
</table>
出于某种原因,下拉列表都表示未定义且根本无法选择。我检查页面和下拉元素,它们都有正确的选项和值,就好像这样有效,但它没有。任何帮助非常感谢!
答案 0 :(得分:0)
这是你想要的吗?
var vm = {
omnivoreTables: [
{name: 'One',
id: '1'},
{name: 'Two',
id: '2'}
],
selectedOmnivoreTableId: ko.observable(1),
tables: ko.observableArray([
{name: 'First'},
{name: 'Second'},
{name: 'Third'}
])
};
ko.applyBindings(vm);
&#13;
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<table class="table table-bordered">
<thead>
<tr>
<th>Nextable Name</th>
<th>POS Name</th>
</tr>
</thead>
<tbody data-bind="foreach: tables">
<tr>
<td data-bind="text: name"></td>
<td>
<select class="span8 dropdown" data-placeholder="Select Pos Table" data-bind="options: $parent.omnivoreTables, optionsText: 'name', optionsValue:'id', value: $parent.selectedOmnivoreTableId"></select>
</td>
</tr>
</tbody>
</table>
&#13;