我正在将ko.observablearray绑定到一个表。数组中的每个对象(称为“组”)都绑定到表。每组包含另一个(非敲除)代码数组。每个代码都绑定到一行。每个代码都有一个布尔值,绑定到一个复选框。
如果组中没有布尔值,我希望启用该组的所有复选框。如果组中至少有一个布尔值为真,我希望禁用该组的假复选框,并启用真正的复选框。加载页面时,这可以按预期工作;但是,当我选中或取消选中一个框时,框的启用/禁用状态不会改变。使用调试器查看它,observablearray正在更新,但表中的数据不是。
Page:
<table data-bind="foreach: {data: Groups}">
<thead>
<tr>
<th colspan="3" data-bind="text: GroupName"></th>
</tr>
</thead>
<tbody data-bind="foreach: {data: Codes}">
<tr>
<td data-bind="text: CodeId"></td>
<td data-bind="text: Desc"></td>
<td>
<input type="checkbox" data-bind="checked: Prime, disable: $root.HasPrime($parent) && !Prime" />
</td>
</tr>
</tbody>
</table>
Javascript函数,用于测试组中是否存在任何真值:
var HasPrime = function (gr) {
for (var i = 0; i < gr.Codes.length; i++) {
if (gr.Codes[i].Prime === true) {
return true;
}
}
return false;
};
答案 0 :(得分:3)
如果你想要双向绑定,你需要制作 observable 。在您的情况下,Prime
属性必须是可观察的:
var code1 = {
'CodeId': 123,
'Desc': 'Code 1',
'Prime': ko.observable(false) // <---- changed!
};
这将需要对其余代码进行一些相应的更改:
Prime
作为获取当前值的方法请参阅this fiddle了解更新。