jqGrid ist ein auf JavaScript/ jQuery basierendes Modul fĂŒr die komfortable und professionelle Darstellung von HTML-Tabellen. Es gibt eine ganz gute Dokumentation, von der man aber nicht immer erwarten darf, dass sie aktuell ist.
DafĂŒr sind die Entwickler von jqGrid in ihrem Blog und auf stackoverflow.com sehr bemĂŒht, Probleme zu lösen und Beispiele zur VerfĂŒgung zu stellen. Das ist auch oft notwenig, denn jqGrid ist komplex und besitzt gefĂŒhlte 2 Mio. Optionen.
Beim vorliegenden Fall handelte es sich um eine jqGrid Anwendung, die mit steigender Datenmenge nur noch einen weiĂen Bildschirm ablieferte.
Der „datatype“ in den Optionen von jqGrid war „local“, d.h. das Grid liest seine Daten von der Seite, auf der es aufgerufen wird. Zur Verringerung der Datenmenge gab es zwei Datumsfelder (von-bis), mit denen die Datenbankabfragen modifiziert werden konnten.
Lösung:
1. Umstellung auf ajax und XML, d.h. die Datenerzeugung und Vorverarbeitung wird auf einer zusĂ€tzlichen Seite (‚get_data_from_server.php‘) gemacht
Die neuen Optionen waren dann:
url:’get_data_from_server.php‘,
datatype: „xml“,
mtype: „POST“, …..
Dadurch spart man sich z.B. die im Falle „local“ notwendigen jQuery/ jqGrid Aufrufe, um die lokalen Daten in die entsprechenden Tabellenelemente zu kopieren:
jQuery(‚#………..‘).jqGrid(‚addRowData‘,….
Bei der Umstellung auf XML muss man etwas aufpassen. XML1.0 erlaubt eine Reihe von Zeichen nicht. Diejenigen, ĂŒber die man in unseren Breiten am hĂ€ufigsten stolpern wird, sind < und &.
Hier hilft es, < und & zu maskieren ( in PHP mit htmlspecialchars() ) .
Alternativ können solche Daten auch mit CDATA  getagged werden. Die lÀsst der XML Parser auch passieren.
Unangenehm sind aber auch Steuerzeichen von 0x00 bis 0x1f. Hier akzeptiert XML nur 0x09 (HT), 0x0a (LF) und 0x0d (CR).
Steuerzeichen können z.B ĂŒber eine Textbox ins System reinrutschen, in die ein Benutzer einenMS- Word-Text hinein kopiert.
Hier hilft z.B. bei PHP
preg_replace(‚/[\x00-\x08\x0b-\x0c\x0e-\x1f]/‘, ‚ ‚, $string);
oder wieder CDATA  verwenden.
jqGrid zeigt bei nicht erlaubten Zeichen zwar die Anzahl der DatensÀtze richtig an, stellt sie aber nicht dar.
Also: schaut euch die js Konsolen eures Webrowsers gut an (bei Firefox sollte man den Firebug benutzen)
2. paging: Limitierung auf x DatensÀtze
StandardmĂ€Ăig ĂŒbertrĂ€gt jqGrid vier Felder per POST an get_data_from_server.php
– die Sortierreihenfolge ( ab- oder aufsteigend)
– das Feld, nach dem sortiert werden soll (order by)
– die Anzahl der gewĂŒnschten DatensĂ€tze (limit)
– den Offset (mit welchem Datensatz wird begonnen)
Damit kann man sehr einfach die Datenmenge beschrÀnken und dem Benutzer trotzdem die Möglichkeit geben, sich alle DatensÀtze ansehen zu können
In den Optionen kann man z.B. dann folgendes eintragen
rowNum: 10,
rowList:[10,20,100],…
rowNum ist der Standard, rowList erzeugt ein kleines Popup, mit dem der Benutzer die Anzahl der anzuzeigenden DatensÀtze umstellen kann
3. Limitierung auf bestimmte Datumsbereiche
Auch der Datumsbereich lĂ€Ăt sich noch in die neue Lösung einbauen. Dazu benutzt man die postData Option von jqGrid:
postData: {
from: function() { return $(„#von“).val(); },
till: function() { return $(„#bis“).val(); },
},…
#von bzw. # bis sind die IDs zweier Eingabefelder, die hier mit jQuery ausgelesen werden.
Damit werden zwei weitere Felder per POST an get_data_from_server.php gesendet, die man z.B. so auswerten kann:
if (isset ( $_POST [„from“] ) && $_POST [„from“] != „“) {
$from = $_POST [„from“] ;
$till = isset ( $_POST [„till“] ) && $_POST [„till“] != „“ ? $_POST [„till“] : $from;
} else {
$from = date ( „Y-m“ );
$till = date ( „Y-m“ );
}