Seit einiger Zeit beschäftige ich mich wieder etwas intensiver mit Visualforce.
Eine neue Visualforce Seite muss die Konfiguration von 10 verschiedenen Objekte ermöglichen.
Die einfachste Lösung ist die Benutzung von apex:tabPanel - was im Endeffekt eine Tabelle mit mehreren Tabs darstellt. Unter jedem Tab wird jeweils ein List View ausgegeben, was mit APEX Mitteln ebenfalls ganz einfach funktioniert.
Eine einzige große Schwachstelle in diesem Konstrukt ist das kurzzeitige Verlassen der Seite. Das passiert immer dann, wenn ein neuen Datensatz erstellt oder ein bestehender Datensatz gelöscht wird. Nach der Aktion wird zwar die Visualforce Seite automatisch geöffnet, aber der falsche Tab ist aktiv.
Mit einer kleinen Anpassung bringt man der Visualforce Seite bei, den richtigen Tab beim Öffnen der Seite zu aktivieren.
Das Ergebnis ist im folgenden Videoschnitt zu sehen. Hier sieht man einen Ausschnitt einer Visualforce Seite mit diversen Tabs und das Verhalten der Seite beim Löschen von Datensätzen aus der in die Seite integrierten Listenansicht.
Anpassungen:
1) Beim Klicken auf die Tabs wird der Name des aktiven Tabs im Cookie festgehalten:
onTabEnter="jsResetCookie('tab2name');"
Die als ActionFunction deklarierte JavaScript Funktion apex:actionFunction name="jsResetCookie" übergibt den aktiven Cookie-Namen an den Controller und die entsprechende Controller Methode resetPageCookie überschreibt den Cookie.
2) Beim Laden der Seite wird der Name des aktiven Tabs aus dem Cookie über die Page-Action action="{!initSettings}" gelesen und der aktive Tab in der Tabelle markiert <apex:tabPanel ... value="{!cookieValue}" >
VisualForce Page
<apex:page controller="myController" action="{!readPageCookie}">
<apex:pageMessages />
<apex:form >
<!-- ACTION FUNCTIONS -->
<!-- RESET COOKIE -->
<apex:actionFunction name="jsResetCookie" action="{!resetPageCookie}" reRender="emtyBlock">
<apex:param name="firstParam"
value="" assignTo="{!cookieValue}"
/>
</apex:actionFunction>
<!-- Empty panel for Cookie Reset -->
<apex:outputPanel id="emtyBlock" />
<!-- ---------------- -->
<!-- TABBED TABLE -->
<apex:tabPanel switchType="client" selectedTab="{!cookieValue}"
value="{!cookieValue}" >
<!-- TAB 1 -->
<apex:tab label="Mein Tab1" name="tab1name"
id="tab1" onTabEnter="jsResetCookie('tab1name');">
hier kommt der Inhalt
</apex:tab>
<!-- TAB 2 -->
<apex:tab label="Mein Tab2"
name="tab2name" id="tab2" onTabEnter="jsResetCookie('tab2name');">
hier ist ein List View
<apex:ListViews type="User__c" id="ListUsers"
/>
</apex:tab>
<!-- TAB 3 -->
<apex:tab label="Mein Tab3"
name="tab3name" id="tab3"
onTabEnter="jsResetCookie('tab3name');">
hier ist noch ein List View
<apex:ListViews type="Holiday__c" id="ListHolidays" />
</apex:tab>
</apex:tabPanel>
</apex:form>
</apex:page>
Controller
public without sharing class ControllerResourceManagement {
public String cookieValue{get; set;}
/*++++++++++++++++++
resetPageCookie
*/
public void resetPageCookie() {
Cookie
activeTab = new Cookie('activeTab', cookieValue, null, -1, false);
// Set the new cookie for the page
ApexPages.currentPage().setCookies(new Cookie[]{activeTab});
}
/*++++++++++++++++++
readPageCookie
*/
public void readPageCookie() {
cookieValue
= 'tab1';
Cookie
c = ApexPages.currentpage().getCookies().get('activeTab');
if(c != null)
cookieValue
= c.getvalue();
}
}
Kommentare
Kommentar veröffentlichen