HI, Ich sehe SlickGrid und ich kann Beispiel sehen, wie man die Zelle bearbeitet, aber ich speichere diese Änderungen. Ich muss noch ein Beispiel finden, das mir sagt, wie man das macht.Speichern von Änderungen in SlickGrid
Der Trick zum Speichern des SlickGrid besteht darin, zu erkennen, dass das Raster das Datenfeld aktualisiert, das Sie beim Erstellen des Rasters beim Bearbeiten der Zellen angegeben haben.
Die Art, die ich dann speichern, ist, ein Formular mit einem Absenden-Button und einem versteckten Feld unterhalb des Rasters zu enthalten. Ich fange das Submit-Ereignis ein und verwende das JSON plugin, um das Array zu serialisieren und es in das versteckte Feld zu platzieren. Auf der Serverseite erhalten Sie eine JSON-Zeichenfolge, die Sie deserialisieren, durchlaufen und in die Datenbank schreiben können.
Array von Daten Unter der Annahme, „Daten“ wie die Proben genannt, für Sie die folgenden sollte funktionieren:
<form action="?" method="POST">
<input type="submit" value="Save">
<input type="hidden" name="data" value="">
</form>
<script>
$(function() {
$("form").submit(
function() {
$("input[name='data']").val($.JSON.encode(data));
}
);
});
</script>
Während ich persönlich das JSON serialisieren und senden in einem versteckten Feld Ansatz from my previous answer eine andere Verwendung Ansatz könnte sein, das von SlickGrid ausgelöste onCellChange-Ereignis abzufangen, nachdem sich ein Zellenwert geändert hat, und einen Ajax-Aufruf an den Server zu senden, um den geänderten Wert zu speichern. Dies führt zu vielen kleinen Ajax-Anfragen an den Server (die die Belastung erhöhen können), aktualisiert jedoch den Server, sobald Änderungen vorgenommen werden.
Ich habe ein Beispiel auf diese Weise implementieren, aber ich würde lieber Ihr erstes Beispiel, wo Batch-Updates verarbeitet werden, aber ich kann die Vorteile von beiden sehen, auf jeden Fall großartig zu sehen, es gibt mindestens jemand anderes es verwenden;) – Rubans
Ich bevorzuge die Batch-Methode selbst , aber ich dachte, ich würde die andere Idee für die Vollständigkeit hinzufügen :) –
Viel besser und zuverlässiger als die Batch-Methode Imo. – EarlyPoster
Der Vollständigkeit halber ein minimales Beispiel, das die Verwendung von onCellChange demonstriert, auf die in Jim OHallorans Beitrag Bezug genommen wird.
Weitere Informationen und alle Ereignisse, die ähnlich wie onCellChange verwendet werden können, finden Sie unter Kommentare zu Beginn der SlickGrid source.
<head>
<!-- boilerplate omitted ... -->
<script type="text/javascript">
var grid;
var options = {
enableCellNavigation: true,
enableColumnReorder: false,
autoEdit: false,
editable: true,
};
var columns = [
{id: "item_key", name: "Key", field: "item_key" },
{id: "value", name: "value", field: "value", editor: LongTextCellEditor }
];
var data = [
{item_key: "item1", value: "val1"},
{item_key: "item2", value: "val2"},
];
$(document).ready(function() {
grid = new Slick.Grid($("#myGrid"), data, columns, options);
//Earlier code for earlier version of slickgrid
// grid.onCellChange = function (currentRow, currentCell, item) {
// alert(currentRow+":"+currentCell+"> key="+item['item_key']+", value="+item['value']);
//Updated code as per comment.
grid.onCellChange.subscribe(function (e,args) {
console.log(args);
});
};
});
</script>
</head>
<body>
<div id="myGrid" style="height:10em;"> </div>
</body>
Die API für diese Methode hat sich leicht geändert: 'grid.onCellChange.subscribe (function (e, args) { console.log (Argumente); });' Args ist ein Objekt mit der Zelle, Zeile das Rasterobjekt und das bearbeitete Element. – Solsys
@Iclark Können Sie erklären, wie ich eine bestimmte Zelle für ein DB-Update anvisiere? Da Ihre Daten grundsätzlich ein Schlüsselwertpaar sind, bei dem der Schlüssel mit dem Wert des Spaltenfeldschlüssels übereinstimmen muss, sehe ich nicht, wie ich eine eindeutige ID meines Zellenelements bereitstellen kann, damit ich dieses Element mit der Datenbankentität vergleichen kann. Wie kann ich die eindeutige ID meines Zellenelements an die Stelle übergeben, an der ich beim Aktualisieren der Datenbank nur das Element aus der geänderten Zelle und nicht das gesamte Raster aktualisiere? – Marko
gute Eins. Ich habe eine Implementierung von JavaScript-Hashtable verwendet, um die geänderten Zeilen zu sammeln (http://www.mojavelinux.com/articles/javascript_hashs.html) – Amit
HI Jim, das ist die Idee, mit der ich gegangen bin. Dachte da vielleicht noch ein paar andere Implementierungen aber rate nicht. Das ist gut, danke. – Rubans
Das bringt mir nur ein leeres Gitter, nachdem ich auf den Speichern-Knopf geklickt habe. Was mache ich falsch? – randomizertech
Ich möchte nur hinzufügen, dass mit dem Browser Standard ['JSON.stringify'] (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify) sollte in Ordnung sein heutzutage. Es gibt keine Notwendigkeit, die jQuery-Plugin-Route zu gehen, es sei denn, Sie müssen einige wirklich alte Browser unterstützen. – user128216