Dynamic pages with tabs

UI Components for JSF
Post Reply
ratang2000
Posts: 6
Joined: 02 Nov 2011, 11:40

02 Nov 2011, 11:51

Hi Guys,
This topic has been in discussion and till date I have not found a solution for this that works- viewtopic.php?f=3&t=1251

My requirement is simple, that I have a Tree node on the left side of the page. The Tree node's model is generated dynamically from a set of data from the database.
On the selection on of a node, I need open a tab loaded with a facelet page in it as its content. The node selection event would tell me which xhtml needs to be opened and on the basis of that I need to show a tab with the content of the appropriate xhtml dynamically.
Questions:
- Whats the best way to approach this solution, given that ui:include doesn't work dynamically and applying using faceletfactory is problematic?
- Can I create tabview's and tab programatically with Prime faces 3.0. I seem not to be able to achieve this using new TabView() and new Tab() and setting the tab is a child to TabView.

These are fundamental requirements and they just don't seem to be fulfilled with the limitation of the ui:include..Any pointers guys.

I'm using Mojarra 2.1.3 with Prime faces 3.0 M4.
Thanks,
Prateek

User avatar
Oleg
Expert Member
Posts: 3805
Joined: 02 Oct 2009, 09:41
Location: Germany, Black Forest

02 Nov 2011, 12:21

Hi,

ui:include is dynamic with your Mojarra version. Have you tried it?
PrimeFaces Cookbook (2. edition): http://ova2.github.io/primefaces-cookbook/ Learning Angular UI Development with PrimeNG: https://github.com/ova2/angular-develop ... th-primeng Blog: https://medium.com/@OlegVaraksin

ratang2000
Posts: 6
Joined: 02 Nov 2011, 11:40

02 Nov 2011, 12:45

Hi Oleg,
Yes I tried that, but it didn't work.
Here is the code:

View:

Code: Select all

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui"
        xmlns:corejsf="http://corejsf.com" xmlns:c="http://java.sun.com/jsp/jstl/core">
		<h:head>
			<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
		</h:head>
		<h:body>
			<h:form id="form"> 
                                <p:growl id="messages" showDetail="true" /> 
				
                                            <p:tree var="node" value="#{treeBean.root}" dynamic="true" cache="false" selectionMode="single" >  
                                                <p:ajax event="select" update=":form" listener="#{treeBean.nodeSelect}" />
                                                <p:treeNode>  
                                                <h:outputText value="#{node}"/> 
                                                </p:treeNode>  
                                            </p:tree>  		
                                <p:tabView id="tabView" var="vf" value="#{treeBean.tabModel}" dynamic="true">
                                    <p:tab title="#{vf.viewName}">
                                        <ui:include src="#{vf.pageView}" />
                                    </p:tab>
                                </p:tabView>
			</h:form> 
		</h:body>
</html>

Code: Select all

public class TreeBean extends FrameBean implements Serializable {
    private TreeNode root;
    private TreeNode selectedNode;
    private List<ViewModel> tabModel;

    private TabView tabView;

    /**
     * 
     */
    @Override
    public TreeBean {
        root = new DefaultTreeNode("Root", null);  
        TreeNode node0 = new DefaultTreeNode("Test 1", root);  
        TreeNode node1 = new DefaultTreeNode("Test 2", root);  
        TreeNode node2 = new DefaultTreeNode("Test 3", root);  
          
        TreeNode node00 = new DefaultTreeNode("Test1View", node0);  
          
        TreeNode node10 = new DefaultTreeNode("Test2View", node1);  
        
        TreeNode node20 = new DefaultTreeNode("Test3View", node2); 
      
  
        tabModel = new ArrayList<ViewModel>();
        
     
    }

   

    public void nodeSelect(NodeSelectEvent event) throws IOException {
        System.out.println("onNodeSelect");
        FacesMessage msg = new FacesMessage(FacesMessage.SEVERITY_INFO, "Selected", event.getTreeNode().getData().toString());

        FacesContext.getCurrentInstance().addMessage(null, msg);
        String viewName =event.getTreeNode().getData().toString().trim();
        tabModel.add(new ViewModel(viewName,viewName+".xhtml"));        
    }
Any idea what may be wrong?

User avatar
Oleg
Expert Member
Posts: 3805
Joined: 02 Oct 2009, 09:41
Location: Germany, Black Forest

02 Nov 2011, 13:10

I'm not sure how p:tabView works. Can you try withput p:tabView please?
PrimeFaces Cookbook (2. edition): http://ova2.github.io/primefaces-cookbook/ Learning Angular UI Development with PrimeNG: https://github.com/ova2/angular-develop ... th-primeng Blog: https://medium.com/@OlegVaraksin

ratang2000
Posts: 6
Joined: 02 Nov 2011, 11:40

02 Nov 2011, 13:18

Hi Oleg,
I figured the problem. It seems that tabview var attribute, which points to the current object in the iterated datamodel does not get available in the ui:include value expression for some reason. I stored the variable of the ui:include in the backing bean instead and it now works dynamically.
Thanks for the help!

Prateek.

User avatar
Oleg
Expert Member
Posts: 3805
Joined: 02 Oct 2009, 09:41
Location: Germany, Black Forest

02 Nov 2011, 15:10

Yes, that's right. Dynamic tabs are generated at render response phase. Your ui:include is inside of such tab. I guess, ui:inlcude should be available at build component tree time and be not inside of dynamic generated content. Your variable can't be available in ui:include at the render response time because ui:include is not a component and doesn't get evaluated at this time :-) This is a JSF specific and has nothing to do with PrimeFaces. Think about JSTL tags - that's exactly the same.
PrimeFaces Cookbook (2. edition): http://ova2.github.io/primefaces-cookbook/ Learning Angular UI Development with PrimeNG: https://github.com/ova2/angular-develop ... th-primeng Blog: https://medium.com/@OlegVaraksin

User avatar
Oleg
Expert Member
Posts: 3805
Joined: 02 Oct 2009, 09:41
Location: Germany, Black Forest

02 Nov 2011, 15:18

This is a typically misunderstanding if you don't work a lot with JSF. http://www.ninthavenue.com.au/blog/c:fo ... n-facelets
PrimeFaces Cookbook (2. edition): http://ova2.github.io/primefaces-cookbook/ Learning Angular UI Development with PrimeNG: https://github.com/ova2/angular-develop ... th-primeng Blog: https://medium.com/@OlegVaraksin

ratang2000
Posts: 6
Joined: 02 Nov 2011, 11:40

03 Nov 2011, 09:45

Hi Oleg,
Thanks for the article.. The information was insightful...
Given the above requirement, what would be the way to solve it ?

Thanks,
Prateek

User avatar
Oleg
Expert Member
Posts: 3805
Joined: 02 Oct 2009, 09:41
Location: Germany, Black Forest

03 Nov 2011, 10:17

You should force explicit navigation to the same view to force re-building of the view programmatically:

Code: Select all

FacesContext ctx = FacesContext.getCurrentInstance();
ViewHandler viewHandler = ctx.getApplication().getViewHandler();
UIViewRoot viewRoot = viewHandler.createView(ctx, ctx.getViewRoot().getViewId());
ctx.setViewRoot(viewRoot); ctx.getApplication().getNavigationHandler().handleNavigation(ctx, null, null);
Or maybe try to raise an PostAddToViewEvent with FacesContext.getCurrentInstance().getApplication().publishEvent(....). Publishing of PostAddToViewEvent leads to a rebuild of component (sub)tree. Note: I have never tried it.
PrimeFaces Cookbook (2. edition): http://ova2.github.io/primefaces-cookbook/ Learning Angular UI Development with PrimeNG: https://github.com/ova2/angular-develop ... th-primeng Blog: https://medium.com/@OlegVaraksin

jlferreira
Posts: 43
Joined: 16 Nov 2010, 17:52

15 Nov 2011, 15:55

May you put your final code?
Thanks.
Eclipse Helios.
JSF-2.0 (Mojarra 2.1.0-b11).
GlassFish 3.1.
PrimeFaces 2.2.1
EclipseLink 2.1.x - EclipseLink 2.1.x.
PostgreSQL 9.0

Post Reply

Return to “PrimeFaces”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 24 guests