Information & Consulting

Mit dem »LiveGrid« von Rico stehen hübsche interaktive Tabellen für die Darstellung von beliebigen Werten auf Webseiten zur Verfügung. Es stehen sogar spezielle Controls zur Verfügung, damit nicht nur einfache Zeichenketten dargestellt werden können.

Mit »Rico.TableColumn.checkbox« lassen sich boolesche Werte z.B. als Checkboxen anzeigen, was dem intuitiven Verständnis der Werte enorm zuträglich ist. Wenn auf eine Checkbox geklickt wird, ändert sich ihr Status, so wie man es erwarten würde.

Möchte man allerdings eine Funktionalität implementieren, die alle Checkboxen auf einen Schlag ein- bzw. ausknipst, wird es schon etwas hakelig. Da geht es tief ins Eingemachte von Rico. Das Framework Rico hat für so einen Fall jedoch schon Vorsorge getragen. Jede Checkbox hat beim Anlegen gleich einen eigenen eindeutigen Namen erhalten, über den sich der Zustand setzen läßt.

Mit einer for-Schleife werden dazu alle sichtbaren Zeilen durchgegangen und der Status der Checkbox angepaßt. Zusätzlich wird der interne zu der jeweiligen Checkbox gehörende Wert angepaßt. Dabei muß man aufpassen, denn das Array ist häufig größer und enthält Nullwerte, die man ausklammern muß.

   var basename = 'liste_' + this.liveGrid.name + '_chkbox_' + this.index + '_';
   var childCnt = this.numRows();
   var val = value?true:false;
   for (var r = 0; r < childCnt; r++)
       if (this.getValue(r) != null) {
           this.setValue(r, value);
           var name = basename + r;
           $(name).checked = val;
       }

Bei großen Listen reicht dieser Code allerdings nicht aus, denn die nicht sichtbaren Zeilen sind auf diese Weise von der Änderung nicht betroffen. Wird nun gescrollt, dann zeigen die Checkboxen über und unter vormals sichtbaren Fenster noch die alten Werte.

Diese werden nämlich aus dem Buffer nachgeladen und anschließend dargestellt. Dort wurde jedoch nur der sichtbare Bereich angepaßt. Die Methode »setValue« reicht die Werte zwar durch, sie wird jedoch nicht häufig genug aufgerufen. Mit dem folgenden Block wird anschließend der Puffer aktualisiert, so daß wieder man gefahrlos scrollen darf.

   var rows = this.liveGrid.buffer.totalRows;
   for (var i = 0; i < rows; i++)
       this.liveGrid.buffer.setValue(i, this.index, value);