多重选择列表和KnockoutJS
Multiple Select List and KnockoutJS
我有一个多选择列表,我已经按照KO网站上的说明实现了。我的代码的重要部分目前看起来像这样(删除了不必要的代码):
function Attribute(data) {
var self = this;
self.Id = data.Id;
self.Name = data.Name;
}
// Individual Row in Table
function Criteria(data) {
var self = this;
self.Attributes = data.Attributes;
}
// Represent the ViewModel for attributes.
function CriteriaViewModel() {
var self = this;
// Catalog Data
self.availableAttributes = window.ko.observableArray([]);
$.getJSON(window.attributeListUrl, function(availableData) {
self.availableAttributes($.map(availableData.Attributes, function(item) { return new Attribute(item); }));
});
// Editable Data
self.criterion = window.ko.observableArray([]);
// Load initial state from server
$.getJSON(window.criteriaListUrl, function (availableData) {
self.criterion($.map(availableData.Criterion, function (item) { return new Criteria(item); }));
});
}
然后,在我的HTML中,我将它们绑定在一起(或者,我至少尝试):
<tbody data-bind="foreach: criterion">
<tr>
<td>
<select class="selectedAttributes"
data-bind="options: $root.availableAttributes, selectedOptions: Attributes, optionsText: 'Name', optionsValue: 'Id'"
multiple
size="6">
</select>
</td>
</tr>
</tbody>
正确显示可能的选项。然而,标准的属性与可能的选项之间没有明显的绑定。从阅读指南来看,KO似乎应该能够直接绑定对象。有人能提供指导吗?
我忘了说,除了多选择列表的实际绑定,其他的都可以工作。一般来说,我恰当地应用了我的绑定——只是没有使用多选择列表。
Criteria对象的attributes属性需要是一个observableArray。下面是一个演示
的示例function Criteria(data) {
var self = this;
self.Attributes = ko.observableArray(data.Attributes);
}
var x= $('#select1 option:selected');
if(x.length>0){
x.each(function(){
alert($(this).text());
self.selectedCategory.push(new categoryModel($(this).text()));
$('#select1 option:selected').remove();
});
}
引用http://jsfiddle.net/deepakpandey1234/wse4gdLq/
相关文章:
- Knockoutjs - 单击按钮时打开选择下拉列表
- Knockoutjs:更改下拉列表中所选值的颜色
- Knockoutjs - 如何在选择下拉列表中预先选择第一个选项
- KnockoutJS - 将值从输入链接到数据列表值
- 将下拉列表中的值添加到 KnockoutJS 中另一个下拉列表中的任何值集
- KnockoutJS 绑定来自 AJAX 调用的对象列表
- KnockoutJS从可观察数组中删除项目.Item 是 ul 中的列表项,由 foreach 生成
- Knockoutjs for each n 行检查下拉列表是否有值
- KNOCKOUTJS 将项目列表绑定到下拉列表
- 使用每个项目在KnockoutJS中创建编号列表's在可观测数组中的位置
- KnockoutJS-将值加载到下拉列表.“选定值”始终为null
- KnockoutJS”;“已检查”;绑定不'不能使用observableArray和单选按钮列表
- Knockoutjs 在尝试创建一系列无序列表时抛出异常
- 使用KnockoutJS链接选择列表
- 使用knockoutjs更新模板中下拉列表中所选项目的文本区域
- 使用knockoutJS,如何将列表项绑定到同一个视图
- 多重选择列表和KnockoutJS
- KnockoutJS中的下拉列表没有绑定
- 选择列表中的KnockoutJs绑定问题
- 从Knockoutjs下拉列表传递值到SQL MVC5