All geek questions in one place

JSF 2.0 Menu Navigation Task

I am new to JSF, I am currently running JSF 2.0 with tomcat and Primefaces. I created a simple page using the layoutfaces and primefaces menus. I have a panel with three panels with a menu in the left panel, a main page in the center and some metric / graphic elements in the right panel. I am having trouble understanding how to create separate views for the main panel that will be displayed when I select the appropriate menu item. I want to use ajax, so a page refresh is not required, so I just want to create something, if I have a “custom” tool, when I click on it, user browsing will be displayed in the central panel, similarly if I have a tool settings, I want the configuration view to be displayed.I tried to create separate layoutUnits for each view, and then use rendered = "" to render when a specific tool is clicked on it, but that doesn't work. Can someone shed some light on the right way to do this? I can not find examples on the Internet. Thank you

+3
source share
2 answers

Try to think about your web application in terms of a template and use the Facelets template function. (What version of JSF are you using? Try using JSF2 ...).

Your compliance layout may be part of the template. Therefore, each page ("users", "tools") using the template will actually correspond to the main panel of your layout "automatically" if the left and right panels are added to it.

Let's say you have a “users” submenu in the menu component of the left pane. Then it will refer to your "custom" view (using Ajax).

: http://www.ibm.com/developerworks/java/library/j-jsf2fu2/

+1

: 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>
0

Source: https://habr.com/ru/post/1761503/

More articles:


All Articles