-
1. Re: rich:tabPanel
akira_ag Jun 23, 2007 4:52 AM (in response to jbsabmello)Hi!
I implement this feature with using the action in rich:tab and selectedTab in the tabpanel.
<rich:tab label="MyName" id="MyName" action="#{MySessionBean.activateSecuritySettingsTab}" >
And using after:
<rich:tabPanel id="tblPnl" selectedTab="#{MySessionBean.activeTabName}">
I think you might to create MySessionBean correctly ;-) -
2. Re: rich:tabPanel
jbsabmello Jun 23, 2007 3:39 PM (in response to jbsabmello)Thanks. I end up finding the solution.
-
3. Re: rich:tabPanel
oldkeybo Jun 26, 2007 6:34 AM (in response to jbsabmello)I got similar problem
akira, could you specify more detailed your MySessionBean.
I just try
public void activateSecuritySettingsTab(ValueChangeEvent event) {
activeTabName=event.getNewValue().toString();
}
but it not working -
4. Re: rich:tabPanel
akira_ag Jun 26, 2007 9:25 AM (in response to jbsabmello)Hi!
I don't find any solution then:
class MySessionBean {
private String activeTab;
...
public String activateMyTab2() {
activeTab = "MyTab2";
return null;
}
...
public String getActiveTab() {
return activeTab;
}
}
You can also trying to store in session a TabPanel binding...
I think This is must be working too. -
5. Re: rich:tabPanel
oldkeybo Jun 26, 2007 9:40 AM (in response to jbsabmello)Hi
Thanx for fast replay
I put switchType="server" into <rich:tab>
<rich:tabPanel id="tblPnl" switchType="client" value="#{Bb.currentTab}">
<rich:tab id="uploader" name="uploader" label="Upload" switchType="server">
<ui:include src="/WEB-INF/includes/uploader.xhtml"/>
</rich:tab>
<rich:tab id="manager" name="manager" label="Manage" switchType="server">
<ui:include src="/WEB-INF/includes/manager.xhtml"/>
</rich:tab>
</rich:tabPanel>
looks like it works too -
6. Re: rich:tabPanel
akira_ag Jun 26, 2007 9:44 AM (in response to jbsabmello)No problem.
I'm glad that this problem has many solutions ;-)
Thanks! -
7. Re: rich:tabPanel
oldkeybo Jun 27, 2007 4:43 AM (in response to jbsabmello)Hi again
My System architect almost kill me after he review my previus solution. It really works slow and swichType on tab has higher priority under swichType on tabPanel. So I put swichType="ajax". Like:
<rich:tabPanel id="tblPnl" switchType="ajax" value="#{Bb.currentTab}">
<rich:tab id="uploader" name="uploader" label="Upload">
<ui:include src="/WEB-INF/includes/uploader.xhtml"/>
</rich:tab>
<rich:tab id="manager" name="manager" label="Manage">
<ui:include src="/WEB-INF/includes/manager.xhtml"/>
</rich:tab>
</rich:tabPanel>
very sadly but cant find solvation with swichType="client". Is it really possible in principal -
8. Re: rich:tabPanel
tbealer Oct 2, 2007 2:02 PM (in response to jbsabmello)Has any else looked into changing the selectedTab attributed client side without making a request to backing bean?
-
9. Re: rich:tabPanel
paulaunderwood Oct 30, 2007 3:35 PM (in response to jbsabmello)I am trying to implement this, and I keep getting a error..
javax.faces.el.PropertyNotFoundException: /editprofile.xhtml @17,91 selectedTab="#{userHome.tabValue}": Bean: UserHome_$$_javassist_10, property: tabValue
What do I need to put in the bean?
Thanks -
10. Re: rich:tabPanel
luiggitama Jun 29, 2010 12:33 AM (in response to jbsabmello)Hi everyone!
I know this is a very old question, but I want to share the solution I came up with... IMHO, the offered ones are not good enough, considering that I was redirected here by the RichFaces FAQ...
In my app I needed to save the currently selected tab in the DB (not only the current session), so on the next login the last selected tab would be displayed. In fact, I wanted to save it in a task instance variable, as I'm using Seam + jBPM, but any persistence method should work.
Also, I needed my rich:tabPanel to be switched completely on client-side.
So, for this to work, we need the following:
- RichFaces 3.3.3.Final (I didn't chetk if this works on earlier versions, but I guess it should).
- A rich:tabPanel with the tabs named by id (e.g. "tab1", "tab2" and "tab3", etc.).
- A backing bean (e.g. named "myBean"), with a property (with getter and setter) related to the selected tab name (e.g. selectedTabName).
- An a4j:jsFunction that will do the update on the backing bean property.
- The rich:tabPanel must have its selectedTab attribute associated to the backing bean property.
- Also, the rich:tabPanel must call the a4j:jsFunction by its function name on the ontabchange event, sending the recently updated enteredTabName attribute in the event object (to learn more, see the function RichFaces.onTabChange inside your RichFaces UI jar file: richfaces-ui-3.3.3.Final.jar/org/richfaces/renderkit/html/scripts/tabPanel.js).
Please note:
- We don't need any server-side event listeners - that's the part I didn't like in the older posts, the motivation to figure out this...
- This works with any tab switching method (server, ajax or client).
- The (possible) downside is that on every tab change, the backing bean property will be updated via AJAX. But anyway, when else would you update it?
Finally, here's the code!
The property in the backing bean:
... // You don't need the @In and @Out lines if not using Seam + jBPM // I use them because that's how I save the selected tab // in my task instance for later use @In(required = false) @Out(scope = ScopeType.BUSINESS_PROCESS, required = false) private String selectedTabName; public String getSelectedTabName() { // you could check if it's the first time the page is rendered, // maybe with something like: // if (this.selectedTabName == null) // this.selectedTabName = "tab1"; // or you could check it in your bean creation method return this.selectedTabName; } public void setSelectedTabName(String selectedTabName) { this.selectedTabName = selectedTabName; // here you could add your DB update code for the selectedTabName // or maybe somewhere else. // Seam + jBPM saves the variable in the task instance for me // automatically on conversation end via outjection :) } ...
The a4j:jsFunction and the rich:tabPanel on your page (note how the function is called):
<a4j:jsFunction id="tabChangeFn" name="tabChangeFn"> <a4j:actionparam name="name" value="name" assignTo="#{myBean.currentTabName}" noEscape="true" /> </a4j:jsFunction> <rich:tabPanel switchType="client" selectedTab="#{myBean.currentTabName}" ontabchange="tabChangeFn(event.enteredTabName)"> <rich:tab id="tab1"> ... </rich:tab> <rich:tab id="tab2"> ... </rich:tab> <rich:tab id="tab3"> ... </rich:tab> </rich:tabPanel>
Please tell if this works for you, or if you have any suggestions.
God bless you.
Luis Tama
-
11. Re: rich:tabPanel
ilya_shaikovsky Jun 29, 2010 4:42 AM (in response to luiggitama)Thanks for detailed post! Thats would be greate if you will be able to use wiki posts for such cool design solutions contributions in future. [RichFaces Knowledgebase] It will helps community newcomers much in future!
B.t.w. you talking that should works with any modes. But I believe that additional JS function really need in client mode only. In other mode - you will have request from tabPanel itself and could store information just in change listener. And even more - I'm concerned with the fact that such usage - will cause concurrent requests in ajax or server mode(request fro tabpanel and in the same time request from jsFunction)
-
12. Re: rich:tabPanel
luiggitama Jun 29, 2010 6:16 AM (in response to ilya_shaikovsky)Thanks for your reply, Ilya...
I'm sure you're right when talking about server-side tab switching - tab name could be remembered in that single server request, maybe with some action event listener? What I was pointing out was that my code worked with the 3 modes without changes. I used that solution because I my tabPanel switches tabs client-side...
But... hehe... In fact, I'm already facing some problems with concurrent AJAX requests (on every tab change). I'm solving it with a global a4j:queue, as explained in the examples.
Another solution would be to bind one single call to my a4j:jsFunction on the unload event of the window, but I haven't checked deeply what JS method I should call from tabPanel.js and how. It seems that the page does always wait for these onunload listeners, as stated by jQuery, at least if not closing the browser window, but I haven't tested. I first wanted to try to make it work with pure RichFaces...
And yes, I would really like to contribute to that KB. I must you tell you that I have some JS client-side tricks (added methods and properties, etc.) for some of RichFaces components, because sometimes they can't do what I need them to out-of-the-box...
So... What do you mean by wiki posts? Would it be useful if I change my last post to wiki format or should I create an article or blog post? When posting to the forums, should I always use wiki markup?
Best regards,
Luis Tama
-
13. Re: rich:tabPanel
ilya_shaikovsky Jun 29, 2010 6:38 AM (in response to luiggitama)for clien mode - your solution seems most good one. And for server side - yes I prefer to remove jsFunction and store selectedTab from valueChangeListener of tabPanel.
Asfor contribution - yes, just create new article in RichFaces space, then after published - copy it's permanent link and paste it into main page I shown you by editing it. I'm monitoring all the wiki changes and will be glad to review any contributions.
-
14. Re: rich:tabPanel
stevestair Jun 25, 2012 1:32 PM (in response to luiggitama)How is this any different than just using switchType="ajax"?
<rich:tabPanel switchType="ajax"
selectedTab="#{myBean.currentTabName}">
<rich:tab id="tab1">.
.
.
</rich:tabPanel>