Question

我是JSF的新手，我目前正在使用tomcat和Primefaces运行JSF 2.0。我使用primefaces layoutUnit和primefaces菜单创建了一个简单的页面。我有一个三面板布局，左侧面板中的菜单，中间的主页面，以及右侧面板中的一些指标/图形内容。我在理解如何为主面板创建单独的视图时遇到问题，在选择适当的菜单工具项时将会查看该视图。我想使用ajax，所以没有页面刷新所以我只想创建一些东西，如果我有一个“用户”工具，当我点击它时，用户视图将显示在中心面板中，类似如果我有一个配置工具，我希望显示配置视图。我试图为每个视图创建单独的layoutUnits，然后使用rendered =“”在单击某个工具时呈现它，但这不起作用。任何人都可以对正确的方法有所了解吗？我在网上找不到任何例子。谢谢。

Answer 1

您应该尝试在模板方面考虑Web应用程序并使用Facelets模板功能。（您使用的是哪个版本的JSF？尝试使用JSF2 ......）。

您的primefaces布局可能是模板的一部分。因此，使用模板的每个页面（“用户”，“工具”）实际上对应于您的布局的主面板“自动”添加左侧和右侧面板。

假设您左侧面板的菜单组件中有“用户”子菜单。然后它将链接到您的“用户”视图（使用Ajax）。

您应该阅读：http://www.ibm.com/developerworks/java/library/j-jsf2fu2/

Answer 2

您必须创建模板步骤：1

    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
        xmlns:h="http://java.sun.com/jsf/html"
        xmlns:ui="http://java.sun.com/jsf/facelets"
        xmlns:p="http://primefaces.org/ui"

    <div>
    /* define your pages here.*/
    /*menuPage refers the header information*/        
        <div class="menuPage">
           <ui:insert name="menuPage" />
        </div>     
    /* mainPage refers the what are your .xhtml files*/
        <div class="mainPage">
            <ui:insert name="mainPage" />
        </div>  
     /*footer page*/
        <div class="footerPage">
           <ui:insert name="footerPage" />
        </div> 

    </div>

</html>

步骤：2 然后为MenuPage.xhtml，MainPage.xhtml和FooterPage.xhtml

创建单独的页面

步骤：3 写模板

    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml"
        xmlns:h="http://java.sun.com/jsf/html"
        xmlns:ui="http://java.sun.com/jsf/facelets"
        xmlns:p="http://primefaces.org/ui">


    <ui:composition template="template.xhtml">

        <ui:define name="menuPage">
            <ui:include src="menuPage.xhtml" />
        </ui:define>

        <ui:define name="mainPage">
            <ui:include src="mainPage.xhtml" />
        </ui:define>

        <ui:define name="footerPage">
            <ui:include src="footerPage.xhtml" />
        </ui:define>

    </ui:composition>
</html>

JSF 2.0菜单导航问题

2 个答案: