Information & Consulting

Bei einer Web-Applikation, die mehrere Tabs in einem Panel mit Hilfe der Klasse »Rico.TabbedPanel« von Rico 2.0 darstellt hat es mich genervt, daß bei einem neuen Laden der Seite immer wieder auf das erste Panel gesprungen wurde. Egal in welchem Tab ich gearbeitet habe, beim nächsten Aufbau des Panels war wieder der erste Reiter aktiv.

Offensichtlich haben die Entwickler dieses JavaScript-Frameworks schlicht vergessen, an dieser Stelle eine Möglichkeit zu schaffen, die Einstellungen der Anwender zu speichern. Im LiveGrid werden die Filter und Breite der Spalten während der gesamten Session gespeichert, so daß die Einstellungen bestehen bleiben. Im Panel fehlt dieses Feature schlicht und ergreifend.

   <div class="panelContainer" id="panel_artikel">
     <div>
       <div class="panelHeader">Lager</div>
       <div class="panelHeader">Preise</div>
       <div class="panelHeader">Artikeltexte</div>
       <div class="panelHeader">Listen</div>
     </div>

     <div class="panelContentContainer">
       <div class="panelContent">
           ...
       </div>

       ...

     </div>
   </div>

Ich habe mir daher die Klasse »Rico.TabbedPanel« vorgeknöpft und dahingehend erweitert, daß sie beim Selektieren eines Tabs ein Cookie erzeugt, das beim Initialisieren der Instanz ausgewertet wird. Die neue Klasse »Rico.TabbedPanelCookie« ist ein Drop-in-Replacement von »Rico.TabbedPanel« und bietet zusätzlich dieses Memory-Feature.

   <script type="text/javascript">
   Rico.onLoad( function() {
     var options = {
           panelHeight: 300,
           hoverClass: 'panelHover',
           selectedClass: 'panelSelected',
           border: '#000000',
           color:'#E0E8FA',
           };
     new Rico.TabbedPanelCookie($$('div.panelHeader'), $$('div.panelContent'), options);
   });
   </script>

Wenn der Container, der alle Tabs enthält ein ID-Attribut besitzt, wird dessen Wert zum Namen des Cookies hinzugefügt. Dadurch erzeugen unterschiedliche Panels auch unterschiedliche Cookies und können somit unabhängig voneinander die Einstellungen der Anwender speichern.