ChangeTracking, eine Delta-Sammlung auf der Client-Seite zu schaffen, bevor es an den Server zu senden

Question

Meine app hat eine verschachtelte Struktur in einem Ansichtsmodell auf dem Client. Ich habe Jquery Templating auf jedem Baum Element und es ist rekursiv, wenn es eine treeitemGroup hat. Also das JSON-Objekt an den Client vom Server sieht wie folgt aus gesendet,

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

Meine TreeItemTemplate sieht wie folgt aus,

<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>

Jetzt muss ich in der Lage, Änderungen an der verfolgen IsChecked Eigenschaft auf jedem TreeItem, die jedem Kästchen zum Ankreuzen gebunden ist. Nachdem der Benutzer prüft eine Reihe von TreeItems, wird eine separate Schaltfläche geklickt werden, die [] json Objektarray müssen die Deltas in Form von MvvmTreeItem senden (nur Änderungen, die auf die Checkbox Status auf dem Client passiert ist) an den Server.

Bisher meine Forschungsergebnisse legen nahe, sollte ich überschreiben die Standard-bindingHandler von knockoutjs mit meiner eigenen überprüft und das Ereignis behandeln, indem Sie Elemente in eine Client-Seite Array schieben, aber Schwierigkeiten zu visualisieren, wie das zu erreichen.

Alle Zeiger / Codebeispiele werden geschätzt.

Answer 1

Ich habe gute Fortschritte mit Hilfe der feinen Leute aus mehr als auf der Google-Gruppe für Knockoutjs wie @green und @mkidder (danke Jungs)

Ich sehe immer noch einige Probleme (im Thread erwähnt), und die Hoffnung, Antworten zu finden.

Es wird nicht klar genug sein, wenn Sie die JSFiddle

prüfen

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