google.visualization.datatable mit Checkbox und KnockOut-Datenbindung kombinieren

Ich bin dabei, meine "normalen" HTML-Tabellen in Google DataTable umzuwandeln. Meistens weil es mir feste Header und Sortierung geben wird. Dank Creating advanced KnockOut binding handler for google.visualization.datatable konnte ich einen KnockOut-Bindungshandler für die DataTable erstellen. Dies funktioniert hervorragend für schreibgeschützt Daten.google.visualization.datatable mit Checkbox und KnockOut-Datenbindung kombinieren

Jetzt möchte ich eine Tabelle konvertieren, die ein Kontrollkästchen und ein Eingabetextfeld in jeder Zeile hat. Das Erstellen dieser Formularelemente ist nicht das Problem, aber ich verwende KnockOut Datenbindung auf ihnen. Wie füge ich diese Datenbindung zu meiner Datentabelle hinzu? Ich versuchte dies:

data.setCell(
    0, 0, "<input type='checkbox' data-bind=checked: ' " + order.inOrder + "'/>" 
);

und

data.setCell(
    0, 0, "<input type='checkbox' data-bind=checked: order.inOrder />" 
);

Aber beide funktionieren nicht. Natürlich habe ich versucht mit Google eine Antwort zu finden aber bisher kein Glück.

Edit: Einige weitere Hintergrundinfo: Wir haben eine ziemlich komplizierte Seite, die einige Daten von dem Server unter Verwendung von AJAX und bevölkern den Tisch bekommt. Wir verwenden auch RequireJS, obwohl der Google.Visualisierung Teil außerhalb von RequireJS ist, weil ich Probleme habe, es integriert zu bekommen;)

Die Seite ist Teil eines Assistenten für ein Bestellsystem t order 'und das Eingabefeld soll den Bestand ausfüllen. Der Tisch ist:

checkbox|Product name|amount|input box for stock|amount minus stock|price

Die Schaltfläche Weiter muss die gesamte Tabelle speichern, einschließlich der (aktualisiert) Werte für die Checkbox und Lager.

Quelle

2016-05-04 Paul Meems

Wann führen Sie die Bindung in KO aus? es muss sein, nachdem alles an seinem Platz ist. Und wenn Google irgendwelche Daten ändert (Paginierung usw.), werden Sie wahrscheinlich Probleme haben. Wenn das nicht hilft, teilen Sie bitte den erzeugten HTML-Code plus ein Beispiel des viewModel – brianlmerritt

Ich habe meine Frage aktualisiert und einige Hintergrundinformationen hinzugefügt. Verstehe ich dich richtig und sollte es möglich sein, was ich will? –

Es mag möglich sein, aber Sie müssen die Reihenfolge der Ausführung bestätigen, zB wann erstellen Sie den HTML-Code, wann erstellen Sie das View-Modell, wann binden Sie ihn usw. Sehen Sie sich das an und erstellen Sie ein Minimum vollständig und überprüfbar Beispiel http://stackoverflow.com/help/mcve – brianlmerritt

glaube nicht, Datenbindung mit Google Diagrammen

funktionieren wird

auch wenn es wäre, nicht sehen, viel Nutzen, da Sie die Datatable laden müssen manuell ohnehin

als solche, nur liefern den Wert benötigt, während die Datatable geladen,
so etwas wie ...
data.setCell(0, 0, "<input type='checkbox' " + ((order.inOrder === true) ? "checked" : "") + "/>");

andere Gedanken ...

wenn die Tabelle Diagramm verwendet Paging-Tasten, nur die Zeilen für die aktuelle Seite gerendert wird, so würde die Bindung irgendwie an jedem 'page' Ereignisse

mit einer Checkbox Eingabe in der Tabelle Chart bewirkt, dass das 'select' Ereignis auftreten muß, um Feuer auf die Tabellenzeile beim Anklicken

Quelle

2016-05-04 13:35:09 WhiteHat

Ich benutze keine Paginierung, so dass kein Problem ist.Und das Setzen des Anfangswerts der Checkbox und des Eingabefeldes ist kein Problem. Aber ich muss die Änderungen speichern und momentan verwenden wir Observables dafür. Wenn Sie den Wert im Eingabefeld ändern, ändert sich auch der Wert einer anderen Zelle, die ebenfalls beobachtbar ist. Wenn ich KO Bindungen nicht benutzen kann, sehe ich nicht, wie man die Funktionalität behält, die wir zurzeit haben. Ich bekomme einen KO-Fehler bezüglich der Bindung, also nehme ich an, dass KO ausgeführt wird, bevor die Datentabelle abgeschlossen ist. –

Kannst du vor dem Binden auf das "ready" -Ereignis des Tischdiagramms warten? – WhiteHat

google.visualization.datatable mit Checkbox und KnockOut-Datenbindung kombinieren

Antwort

Verwandte Themen