preload
Dez 12

ExtJS: Restore grid scroll position after store reload

Werden von einem Grid aus Daten bearbeitet (bspw. durch RowEditing oder Popup), wird nach dem Speichern der Store aktualisiert (bspw. store.load()). Damit nach dem Reload das Grid nicht in die obere linke Ecke zurückscrollt, sondern an der Position bleibt, an der es sich auch zuvor befunden hat, genügt es, in der viewConfig des GridPanels die Eigenschaft preserveScrollOnRefresh auf true zu setzen, was bspw. wie folgt aussehen kann:

  
var grid = Ext.create('Ext.grid.Panel', {
  ...
  viewConfig: {
    ...
    preserveScrollOnRefresh: true,
    ...
  },
  ...
});

Andere Vorgehensweisen, wie bspw. die undokumentierte Eigenschaft invalidateScrollerOnRefresh auf false zu setzen funktioniert zwar bei Updates, bringt jedoch Probleme mit sich, wenn Datensätze gelöscht oder erzeugt werden. Dafür sind wiederum Workarounds notwendig, die man sich ganz einfach sparen kann, indem man die o.g. Methode mit preserveScrollOnRefresh in der viewConfig auf true setzt.

Feb 03

Nehmen wir mal an, wir möchten einen bestimmten Bereich innerhalb einer HTML-Seite per Ajax-Request nachladen. Das kann z.B. sein, um den Inhalt dieses Bereichs zu aktualisieren, da er zwischenzeitlich an anderer Stelle geändert wurde.

Nahmen wir weiter an, wir setzen den Ajax-Request refresh.php ab – der soll den neuen Inhalt für den oben genannten zu aktualisierenden Bereich liefern. In diesem Fall spielt uns der Internet Explorer einen Streich: beim ersten Aufruf klappt die Aktualisierung ganz prima. Da er aber anschließend im Cache liegt, findet bei allen anderen Aufrufen der Aktualisierung kein eigentlicher Request mehr statt, sondern es wird lediglich das geladen, was im Cache liegt. Unschön.

Die Lösung ist zum Glück relativ einfach: einfach eine Zufallszahl an die refresh.php hängen!
Beispiel:

new Ajax.Request("refresh.php?random=" + Math.random(), ...);

Damit klappt’s.

Sep 11

Da das PECL-Package APC (Alternative PHP Cache) bisher bei mehreren parallelen Uploads unzuverlässige Fortschritts-Werte liefert (getestet mit Version 3.0), wurde bisher auf eine Perl-Lösung ausgewichen. Schöner wäre es allerdings, eine reine PHP-Lösung zu haben. Glücklicherweise gibt es noch ein weiteres PECL-Package namens uploadprogress, das mit Version 1.0 nun erstmals als stabile Version vorliegt. Die uploadprogress-Extension für php funktioniert auch bei mehreren parallelen Uploads und lässt sich recht einfach installieren…

Weiterlesen

Aug 14

Möchte man dynamisch eine Tabellenzeile per Javascript ausblenden, erreicht man dies durch die Zuweisung wie in folgendem Beispiel zum Verstecken der zweiten Zeile:

var oTR = document.getElementById(‚TableID‘).rows[1];
oTR.style.display = ’none‘;

Möchte man die Zeile nun wieder anzeigen, erwartet ein korrekter Browser eigentlich das Setzen der Display-Eigenschaft auf „table-row“, also:

oTR.style.display = ‚table-row‘;

Dies interpretiert der Internet Explorer allerdings nicht korrekt, er erwartet ein „display = ‚block'“, was wiederum in W3C-kompatiblen Browsern versagt. Die Lösung liegt in der Zuweisung eines Leerstrings an die Eigenschaft, also

oTR.style.display = “;

Dies wird von (allen?) Browsern richtig verstanden.

Jul 07

Ein Link, bei dem im onclick-Event ein Javascript-Aufruf erfolgt, soll beim Klick üblicherweise keine andere Seite aufgerufen werden. Das sieht bspw. wie folgt aus:

<a href="javascript:void(0);" onclick="alert('Hallo');">Hallo</a>

Damit der IE6 nicht einfach die aktuelle Seite nochmals aufruft, was in vielen Browsern das Standardvorgehen bei leerem href-Attribut ist (href=""), muss im onclick-Attribut false zurückgegeben werden. Die Version, die in allen Browsern funktioniert, lautet also:

<a href="javascript:void(0);" onclick="alert('Hallo');return false;">Hallo</a>

Die schönste Möglichkeit ist es, die Anweisung in das href-Attribut zu stecken und auf das onclick-Event zu verzichten. Der Trick liegt darin, trotzdem immer void(0); am Ende des Aufrufs anzufügen, also bspw. wie folgt:

<a href="javascript:alert('Hallo');void(0);">Hallo</a>

Jul 06

Der direkte Zugriff auf document.getElementById("elementID").value funktioniert in älteren Versionen des Internet Explorers nicht. Doch das ist keineswegs der einzige Fallstrick. In einem Fall half nichts – der IE wollte und wollte nicht auf das value-Attribut zugreifen – weder direkt noch über die Kombination von options- und selectedIndex-Attribut. Die Lösung – wie so oft – ist genauso simpel wie unschön, jedoch keineswegs naheliegend:

Ist im head-Teil des HTML-Dokumentes – unabhängig vom Dokument-Typ – ein Meta-Tag für das Land definiert, also bspw. <meta name="country" content="DE" />, so funktioniert im IE der Zugriff auf das value-Attribut von select-Elementen schlicht nicht mehr. Nach dem Weglassen dieses Meta-Tags funktioniert wieder alles bestens und zwar auf beide Arten:

var obj = document.getElementById("elementID");
var val = obj.value;

und

var obj = document.getElementById("elementID");
var val = obj.options[obj.selectedIndex].value