jquery-basierte Tabelle Paginierung mit Inline-Bearbeitung Unterstützung

Question

Dies könnte einfach für jemanden sein, der bereits etwas ähnliches getan hat.

Ich habe ein einfaches Gitter, in dem ich Daten in Kontrollen machen (dh Textbox, Checkbox, ...), so dass der Benutzer Bulk-Bearbeitung in den gerenderten Zeilen tun kann und dann die Submit-Button alle bekommen die Updates in der Datenbank.

Jetzt habe ich eine funktionierende Version von solchen bearbeitbaren Grid in meinem ASP.Net MVC2 proj. Als nächstes möchte ich haben Sortieren, Seitennummerierung & Filter mit jQuery auf Client-Seite (Sie können davon ausgehen, dass ich das ganze Raster mit viele Datensätze rendern). Ich kann dies leicht mit serverseitigen Codierung und rendern nur eine Seite voll Grid, aber für jetzt in Betracht ziehen, dass ich es auf Client Seite tun möchte.

Ich habe versucht, die einige jQuery-Plugins - sie funktionieren gut, aber für normale Readonly Text basierte Grids. Meine Grids haben Textfeld, Checkbox, die Benutzer bearbeiten können und mein Problem ist, dass keine dieser Plugins ihren bearbeiteten Wert während der Suche beibehalten & Paginierung. Oder sie bestehen es dynamisch - was nicht an den Server weitergegeben wird!

Zum Beispiel in diesem Raster des Checkbox Status entweder nicht über die Paginierung beharrt:

Hoffnung jemand durch diesen gegangen und würde mir helfen. Wir versuchen, die Dinge einfach zu halten & sauber.

Plugins versucht:

• tablesorter.pager
• Datatables.net

Answer 1

Basierend auf ein paar populäre Plugins, die ich so weit und das grundlegende Verständnis überprüft haben (mehr oder weniger), wie würden sie die Paginierung auf Client-Seite erreicht haben, ich ableiten, dass die meisten von ihnen -

Cache die Tabellenzeilen in einer Variablen. Und sie löschen die "TBODY" vor Paging oder suchen und füllen Sie es mit dem Ergebnis.

Also, während des Postback bekomme ich nur die Anzahl der Zeilen "nachgefüllt" und nicht die tatsächliche Tabelle. Zumindest hat das meine MVC-Action gezeigt. Und manchmal war es leer!

Ich schließe daraus, dass, obwohl der Status und die Werte der Kontrollen im Grid scheinen sichtbar über paginaton zu sein, sie sind nicht synchron mit was während Postbacks übergeben wird. Ich würde mich freuen, falsch zu sein oder wenn ein Plugin es besser macht.

LÖSUNG: Vorerst habe ich die Werte, wenn mein aufgegebenes Checkbox in einem Temp Textbox zu protokollieren, die während Postbacks die Werte vorhanden kein ganz gleich, was das Plugin mit der tatsächlichen Tabelle tut werden!

Vielen Dank.

Answer 2

einen Blick auf diesen Artikel vorhanden: http://roberto.open-lab.com/2010/01/30/javascript-grid-editor-i-want-to-be-excel/

Einige dieser Netze geben Sie fast die volle Kontrolle über welche Dinge sind bestehen und wann. Wenn Sie möchten, dass Ihre Kontrollkästchen sofort beibehalten werden, können Sie einen Listener in das Kontrollkästchen einfügen, das den Server aufruft.

Ich bin ein großer Fan von DataTables, aber ich habe es nicht für das spezifische Szenario verwendet, das Sie beschreiben.

Answer 3

Ich schrieb einen Checkbox-Parser für Tablesorter, mit dem Sie die Checkbox-Spalte sortieren können.

Ich habe dies nicht getestet, aber da es die Methode updateCell verwendet, um den Inhalt der zwischengespeicherten Zelle zu aktualisieren, wenn Sie das Kontrollkästchen ändern, denke ich, dass es nur mit dem Pager-Plugin funktionieren könnte.

Auschecken the demo here, kopieren Sie einfach den Parser-Code und versuchen Sie es zusammen mit dem Pager-Plugin.

Bearbeiten: Hoppla, ich habe vergessen, dass es die neueste Version von tablesorter von dieser Gabel auf Github erfordert. Der Grund dafür ist, dass der ursprüngliche Tablesorter nicht alle zusätzlichen Variablen an die Format-Funktion übergibt: format: function(s, table, cell, cellIndex) {}