Primefaces页面布局与树状菜单作为导航

时间:2012-05-04 07:30:25

标签: java jsf-2 primefaces

我正在使用带有`的primefaces 3.1,有四个位置。 在西部位置(西)我添加了树状菜单。 JSF代码如下

<p:layoutUnit position="west" size="200" header="Left"
            resizable="true" collapsible="true">
            <h:form>
                <p:tree dynamic="true" value="#{treeBean.root}" var="node" id="tree"
                    selectionMode="single">
                    <p:treeNode id="treeNode">
                        <h:outputText value="#{node}" id="lblNode" />
                    </p:treeNode>
                </p:tree>
            </h:form>
        </p:layoutUnit>

在TreeBean中我有

root = new DefaultTreeNode("Root", null);  
        TreeNode node0 = new DefaultTreeNode("Color", root);  


        TreeNode node00 = new DefaultTreeNode("Red", node0);  
        TreeNode node01 = new DefaultTreeNode("Blue", node0);
        TreeNode node02 = new DefaultTreeNode("Green", node0);

当我展开并单击其中一个节点并点击相应节点时,是否可以进行导航,如何在布局的中心位置显示jsf页面。即如果我点击节点蓝色,理想情况下我想将另一个jsf页面加载到布局的中心位置。

任何帮助都非常值得赞赏。

由于

更新1

我添加了以下代码,它导航到start.xhtml。但是,start.xhtml不会显示在我的布局中,start.xhtml会显示为新页面。

public void onNodeSelect(NodeSelectEvent event) {

        try {
            System.out.println(" here " + event.getTreeNode().getData());
            FacesContext
                    .getCurrentInstance()
                    .getApplication()
                    .getNavigationHandler()
                    .handleNavigation(FacesContext.getCurrentInstance(),
                            "null", "/start.xhtml?faces-redirect=true");
        } catch (Exception e) {
            logger.info("error "+e.getMessage());
            // TODO: handle exception
        } 

2 个答案:

答案 0 :(得分:2)

这是在布局的帮助下实现的。定义应用程序的布局模板。样品显示在这里......

<强> myLayoutTemplate.xhtml

       <p:layout>
        <p:layoutUnit position="east" header="Menu"  collapsed="true" scrollable="true" collapsible="true" >
            <ui:insert name="appMenu">
                Place Your menu here ...
            </ui:insert>
        </p:layoutUnit>

        <p:layoutUnit position="center" scrollable="true">
            <ui:insert name="pageContent">
                Page Content is loaded here .....
            </ui:insert>
        </p:layoutUnit>
    </p:layout>

在您的Page.xhtml中,点击您的菜单项即可加载,.....

<ui:composition template="myLayoutTemplate.xhtml">
    <ui:define name="pageContent">

    </ui:define>
</ui:composition>

答案 1 :(得分:1)

我认为这篇文章对您Include one xhtml inside another JSF

非常有用

它介绍了如何创建模板,然后在template client中使用它。 @rags已经告诉过你了,但你真的不必使用<p:layout>。上面链接的文章更精确。我相信你会在那里找到你需要的东西。问候