-
1. Re: rich:tabPanel switchTpye=ajax loads all tabs on startup
davisonri_k12 Sep 20, 2012 4:30 PM (in response to rsoika)i am seeing the same issue. Did you ever find a resolution for this ? I see that all my tabs content is loaded at first. I am using Richfaces 4.2.2 even if i enclose the tab content in a subview with rendered = false.
-
2. Re: rich:tabPanel switchTpye=ajax loads all tabs on startup
davisonri_k12 Sep 20, 2012 5:33 PM (in response to davisonri_k12)looks like the issue listed here -
-
3. Re: rich:tabPanel switchTpye=ajax loads all tabs on startup
healeyb Sep 21, 2012 5:34 AM (in response to davisonri_k12)An approach to consider for implementing this efficiently is to only load the data required for a specific tab when it is
selected in an itemChangeListener.
You should never be accessing the database in a getter, I only ever use IDE generated getters & setters in my
application and load data just in time.
<rich:tabPanel id="tabs" switchType="ajax"
itemChangeListener="#{bean.tabChange}"
activeItem="#{bean.activeTab}">
<rich:tab name="tab1" header="Department List">
<rich:dataTable value="#{bean.departmentList}" ...
...
private List<Department> departmentList;
private String activeTab;
public void tabChange(ItemChangeEvent event) {
String newTab = event.getNewItemName();
switch (newTab) {
case "tab1":
departmentList = ... database query ...
break;
case "tab2":
break;
...
}
One slightly annoying point with this approach is that the first tab has to be treated differently because the itemChangeListener
doesn't execute when the page is first loaded (I think it should). So for the first tab you need to use f:event type="preRenderView"
and add any reload code to the listener, instead of or in addition to putting it in the case statement in the itemChangeListener.
This approach does not require activeItem but note that if you use tabPanel immediate="true" (to avoid validation errors on
input components when you change tabs) then activeItem stops working - so if you use activeItem for other reasons then a
workaround is to add lines like activeItem = "tab1"; in each case statement.
Regards,
Brendan.
Java Enterprise Developer
JSF Richfaces Ajax Java 6/7 (scjp) EE 6 HTML CSS JavaScript jQuery MySQL JPA Hibernate Eclipselink
Spring Oracle SQL JPQL Sybase EJB CDI Glassfish Apache JAX-RS Primefaces UNIX Paypal and more..
-
4. Re: rich:tabPanel switchTpye=ajax loads all tabs on startup
ravi.jrk Sep 21, 2012 12:01 PM (in response to rsoika)Hi, there are couple of things can be tried.
1) Use itemchangelistener in rich:tabpanel while navigating to the tab and load the data that is necessay for the the tab by invoking tab specific backing bean.
2) use <ui:include src="#{tabpath}"/> in rich:tab content the src can be dynamically set in the itemchangelisetner.
Thans
Ravi J
-
5. Re: rich:tabPanel switchTpye=ajax loads all tabs on startup
healeyb Sep 22, 2012 5:31 AM (in response to ravi.jrk)> 1) Use itemchangelistener in rich:tabpanel while navigating to the tab and load the data that is necessay for the the tab by invoking tab specific backing bean.
Why didn't I think of that?
-
6. Re: rich:tabPanel switchTpye=ajax loads all tabs on startup
ravi.jrk Sep 24, 2012 11:34 AM (in response to healeyb)Hi,
The data of the first tab can be loaded in the constructor of that bean(BeanOne) and later in itemchangelistener while navigating to that tab.
public void intializeBeansOnTabEnter(ItemChangeEvent itemChangeEvent) throws
ServiceException{String newTab = itemChangeEvent.getNewItem().getId();
UITab uitab =(UITab) itemChangeEvent.getNewItem();
FacesContext context = FacesContext.getCurrentInstance();
switch (newTab) {
case "tab1":
BeanOne beanone = (BeanOne ) context
.getApplication().evaluateExpressionGet(context,
"#{BeanOne }",BeanOne.class);
beanone .initialize();
break;
case "tab2":
break;
}
// clears the components state so that they will be binded with latest data
clearRegion(uitab);
}
For us the requirement was to load the data from DB everytime the user enters the TAB.
Unnecessary loading of the TABs content, backing beans can be avoided using below one. set ajaxrendered= false on the components to avoid unnecessary rendering .
2) use <ui:include src="#{tabsBean.tabTwopath}"/> in rich:tab content the src can be dynamically set in the backing bean.
/*** Returns Tab 2 Path
*
@return*/
public
String geTabTwoPath(){if
return tab2.xhtml;
}
}
I just wanted to bring up one issue since it is switchtype=ajax.
I have noticed one issue using switchtype=ajax in tabpanel. to use switchtype=ajax , entire tabpanel should be placed in one h:form. here is the problem.
since it is a single form, if the tabs are heavy, then loading the popups in the tabs takes time even though we are using limitrender=true, ajaxrender=false.
We have heavy tabs in the rich:tabpanel and it is effecting the performance. If the tabs are not that heavy then loading time is quick.
I wonder to use window modal dialog over rich:popuppanel for the popups in rich:tabpanel when switchtype=ajax for heavy tabs.
Thanks & Regards
Ravi
-
7. Re: rich:tabPanel switchTpye=ajax loads all tabs on startup
davisonri_k12 Sep 24, 2012 2:32 PM (in response to ravi.jrk)thanks for the reply. I am going to have a look at these approaches and let you know how it turns out. while I have your attention do you see this issue ? i posted this question in a different forum. But i am reposting that question here
I have a rich faces tabPanel configured like this. I am using rich faces 4.2
<rich:tabPanel activeItem="#{bean.activeTab" switchType="server" itemChangeListener="#{bean.changeTab}">
<rich:tab name="tab1" header="tabname1" onheaderclick="showPleaseWait()">
......
</rich:tab>
<rich:tab name="tab2" header="tabname2" onheaderclick="showPleaseWait()">
......
</rich:tab>
</rich:tabPanel>
now everything works correctly. however what i am noticing is that when I swtich tabs for a moment both tabs become inactive (both the tabs appear as not selected) and no content shows up under the tabs and then page refreshes as expected and the selected tab is active with its content correctly displayed. it is just that as soon as i select a tab, for a second, both tabs become inactive (almost like some client script is doing so) until the server response comes back.
Has anyone else noticed this and how to get rid of this ?