ChangeTracking,在将其发送到服务器之前在客户端创建增量集合

时间:2011-01-18 16:26:42

标签: javascript jquery json knockout.js

我的应用在客户端的viewModel中有一个嵌套树。我在每个树项上都有jquery模板,如果它有一个treeitemGroup,它是递归的。所以从服务器发送到客户端的json对象看起来像这样,

MvvmTree
- MvvmTreeItemGroup1
---- MvvmTreeItemGroup11
-------- MvvmTreeItem { Title: MyTitle, IsChecked: true }
-------- MvvmTreeItem ... so forth..
-------- MvvmTreeItem ... so forth..
-------- MvvmTreeItem ... so forth..
---- MvvmTreeItem{ Title: MyTitle2, IsChecked: false }
---- MvvmTreeItem
---- MvvmTreeItem
---- MvvmTreeItem
- MvvmTreeItemGroup2
---- MvvmTreeItemGroup21
-------- MvvmTreeItem
-------- MvvmTreeItem
-------- MvvmTreeItem
-------- MvvmTreeItem
---- MvvmTreeItem
---- MvvmTreeItem
---- MvvmTreeItem
---- MvvmTreeItem

我的TreeItemTemplate看起来像这样,

<script type="text/x-jquery-tmpl" id="mvvmTreeViewGroupTemplate"> 
<li>
    <span data-bind="text: Title" class="mvvmTreeItemStyle"/></br/>

    <ul data-bind='template: { 
                            name: "mvvmTreeViewItemTemplate", 
                            foreach: MvvmTreeItems
                            }'>
    </ul>

     <ul data-bind='template: { 
                            name: "mvvmTreeViewGroupTemplate", 
                            foreach: MvvmTreeItemGroups
                            }'>
    </ul>
</li>
</script>
<script type="text/x-jquery-tmpl" id="mvvmTreeViewItemTemplate"> 
<li>
    <input type="checkbox" data-bind="checked: IsChecked" class="checkboxStyle"/> <span data-bind="text: Title" class="mvvmTreeItemStyle"/> (Id: <span data-bind="text: Id" class="mvvmTreeItemStyle"/>)</br/>
</li>
</script>

现在,我需要能够跟踪每个TreeItem上 IsChecked 属性的更改,该属性绑定到每个Checkbox。在用户检查一组TreeItem之后,将单击一个单独的按钮,该按钮将需要以MvvmTreeItem [] json对象数组的形式发送增量(仅将客户端上发生的更改发送到复选框状态)到服务器。 / p>

到目前为止,我的研究表明,我应该用我自己的方法覆盖knockoutjs的默认检查bindingHandler,并通过将项目推送到客户端数组来处理事件,但很难看到如何实现这一点。

任何指针/代码示例都将受到赞赏。

1 个答案:

答案 0 :(得分:0)

Google group for Knockoutjs喜欢@green和@mkidder(感谢小伙伴)的帮助下,我取得了很好的进步

我仍然看到几个问题(在帖子中提到),并希望找到答案。

除非你检查JSFiddle

,否则不够清楚

http://jsfiddle.net/VinKamat/M8W3L/