LightWindow und AJAX
Heute bin ich glücklich, Euch mal wieder einen etwas technischeren Artikel präsentieren zu können.
Es geht um das Zusammenspiel zwischen dem JavaScript-basierten LightWindow (dient grob gesagt dazu, um ein Fenster im Fenster animiert anzuzeigen und zu steuern – Einsatz z.B. für Großansichten von Bildern) und AJAX-Aufrufen im Allgemeinen.
LightWindow im Einsatz beim CakePlanner
In meinem Fall habe ich eine CakePHP-Applikation, die auf Anforderung gewissen Seitenteile per AJAX austauscht. Sowohl auf der Startseite, als auch auf dem nachgeladenen Bereich sind Links verbaut, die die jeweils verlinkten Inhalte in einem LightWindow darstellen sollen.
Auf der Startseite funktionierte das beim Testen auch prächtig. Lud ich jedoch einen Seitenteil nach, wurden die LightWindow-Links unschön “ganz normal” im Browser geöffnet, anstatt im LightWindow.
Ursache: Beim Nachladen verliert LightWindow den Bezug zu den vorhandenen DOM-Objekten (z.B. den Links) und kann dann nicht mehr wie gewünscht auf ein onClick-Event reagieren.
Lösung: Nach dem Nachladen muss die jeweilige LightWindow-Instanz re-initialisiert werden.
Bei mir sah das dann so aus:
<script type="text/javascript">
myLightWindow.initialize();
</script>
Dieses Code-Snippet ziert nun den jeweiligen, nachgeladenen Bereich und siehe da: die Links wurden wieder sauber im LightWindow geöffnet.
[1] LightWindow: http://www.stickmanlabs.com/lightwindow/
[2] CakePHP: http://www.cakephp.org/
[3] CakePlanner: http://sourceforge.net/projects/cakeplanner/