The scenario is a mobile page developed with JSF and Primeface Mobile.
I want to navigate in the same xhtml page between multiple pages. When I click a button in the main page the content must be loaded from managed bean in the second page. I followed this example http://www.primefaces.org/showcase/mobile/navigation.xhtml , but I can't navigate, I have the follow message 'No navigation case match for viewId mobile.xhtml, action #{myManagedBean.gotoSecond} and outcome pm:second'.
Here the xhtml code
<!DOCTYPE html>
<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:p="http://primefaces.org/ui"
xmlns:pm="http://primefaces.org/mobile">
<f:view renderKitId="PRIMEFACES_MOBILE" />
<h:head>
</h:head>
<h:body>
<pm:page id="first">
<pm:header title="Page 1"></pm:header>
<pm:content>
<h:form>
<p:commandButton value="Ajax Action" action="#{myManagedBean.gotoSecond}"/>
</h:form>
</pm:content>
</pm:page>
<pm:page id="second">
<pm:header title="Page 2"></pm:header>
<pm:content>
<p>Page 2 content.</p>
<p:button outcome="pm:first" value="Go Back" />
<h:form>
#{myManagedBean.hello}
</h:form>
</pm:content>
</pm:page>
</h:body>
</html>
And the managed bean method
public String gotoSecond(){
return "pm:second";
}
You need this in your faces config file:
<application>
<navigation-handler>
org.primefaces.mobile.application.MobileNavigationHandler
</navigation-handler>
</application>
Related
I have a PrimeFaces <p:commandButton update=":messages" which doesn't display p:messages after sending the form, but if I use update="#all" instead it does update p:messages and I can see the messages displayed.
I've tried many other combinations such as update="messages", update="NewRegistryForm:messages", update="#form :messages", render=":messages"... but nothing else seems to work. Any idea why this might be happening?
On RegistryInputNewBean.processRequest I simply update the messages component like this:
FacesContext.getCurrentInstance().addMessage(
null,
new FacesMessage(FacesMessage.SEVERITY_ERROR, "", "error_processing_request")
);
mytemplate.xhtml, containing p:messages, is something like this:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
lang="en"
>
<f:view contentType="text/html" encoding="UTF-8" locale="en">
<h:head>
<title>test</title>
</h:head>
<h:body id="pageBody">
<p:messages id="messages" showDetail="true" autoUpdate="true" closable="true" showSummary="false"/>
<ui:insert name="content" />
</h:body>
</f:view>
</html>
myform.xhtml is like this:
<!DOCTYPE html>
<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"
>
<ui:define name="content">
<ui:composition template="mytemplate.xhtml">
<h:form id="NewRegistryForm">
<p:commandButton
id="sendButton"
type="submit"
action="#{registryInputNewBean.processRequest}"
update="#all"
style="display:none" />
</h:form>
</ui:composition>
</ui:define>
</html>
The p:messages is not inside a form, that is why the button is not going to update the component alone, only if you put #all, which refresh all the components in the page.
If you put another form that contain the p:message inside, you will be able to update the component with an update="fooForm:fooMessages"
you can update on the bean
Like
RequestContext rc = RequestContext.getCurrentInstance();
rc.update("id");
I am beginner.
I am doing a project using Primefaces.
I need to include many pages dynamically when triggering the p:menuitem.
I already tried but the dynamic pages are not included properly when clicked on p:menuitem and that page only show when refresh of the page(browser).
Sample Code
<p:menu>
<p:menuitem action="..." value="Page1"/>
<p:menuitem action="..." value="Page2"/>
<p:menuitem action="..." value="Page3"/>
</p:menu>
<p:outputPanel>
<ui:include src="#{Pages.dynamicaPagesInclude}"/>
</p:outputPanel>
I do not know where I did mistake.
Any Idea?
Please, try this:
index.xhtml:This file is the "main" page, the page which contains the menu to select the dynamic pages to load.
When you press over the menuItem, the page attribute is set to the selected page value. Then, an ajax request invokes to changePage method which is in charge to set the page to load. We say to menuItem that we need to update the outputPanel which contains the new page load to show it on the browser.
<!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:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui">
<h:head>
<title>Test Prime</title>
</h:head>
<h:body>
<h:form id="formulario">
<p:menu>
<p:menuitem value="Page1" actionListener="#{pages.changePage(1)}" update="outputPanel "/>
<p:menuitem value="Page2" actionListener="#{pages.changePage(2)}" update="outputPanel"/>
</p:menu>
<p:outputPanel id="outputPanel">
<ui:include src="#{pages.dynamicaPagesInclude}" />
</p:outputPanel>
</h:form>
</h:body>
</html>
page1.xhtml:Dummy page which represents a new page.
<ui:composition
xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets">
<h2>PAGE 1</h2>
</ui:composition>
page2.xhtml:Dummy page which represents a different page.
<ui:composition
xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets">
<h2>PAGE 2</h2>
</ui:composition>
Pages.java:This java class is the ManagedBean for controlling the view. It contains a string field called dynamicaPagesInclude with the path of the page to load.
The method changePage gets the attribute page which was set by the menuitem. Depending its value, chooses a page or other.
import javax.faces.bean.ManagedBean;
import javax.faces.event.ActionEvent;
#ManagedBean
public class Pages {
private String dynamicaPagesInclude;
public String getDynamicaPagesInclude() {
return dynamicaPagesInclude;
}
public void setDynamicaPagesInclude(String dynamicaPagesInclude) {
this.dynamicaPagesInclude = dynamicaPagesInclude;
}
public void changePage(int itemSelected ) {
if (itemSelected == 1) {
dynamicaPagesInclude = "page1.xhtml";
} else {
dynamicaPagesInclude = "page2.xhtml";
}
}
}
Sorry for my English level.
i just don't get it...
Why p:commandLink not working? The page is refreshing but with the same amount of data in table. I'm supposing that controller is okay. Take a look.\
View:
<?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:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui">
<body>
<ui:composition template="./Template.xhtml">
<ui:define name="content" >
<f:view>
<h:form style="padding: 5px">
<p:dataTable id="dataTable2" var="item" value="#{warningsController.warns}">
<p:column rendered="#{loginController.admin}">
<f:facet name="header">
<h:outputText value="Administracja" />
</f:facet>
<h:form>
<p:commandLink id="Remove" value="Remove" action="#{warningsController.remove(item.id)}" ajax="false" />
</h:form>
</p:column>
</p:dataTable>
</h:form>
</f:view>
</ui:define>
</ui:composition>
</body>
</html>
and controller:
public String remove(long a){
//System.out.println(a);
pf.remove(pf.find(a));
return "Listsev.xhtml";
}
You have multiple h:forms cascaded/nested, that's invalid html. Unknown/wanted side effects can/may occur, maybe like you are experiencing right now. Get right if that inner h:form and try again.
In your remove method, pf is the list which you return by calling #{warningsController.warns}?
I tried using the example of showcase tuts from primefaces.org. I copied exactly the same text in my xhtml file as well as TreeBean.java
But The tree structure never appears in the browser(m using IE9). An empty block appears instead of the tree. Is there anything I need to keep in mind when using tree nodes?
!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<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">
<f:view contentType="text/html">
<h:head>
<f:facet name="first">
<meta content='text/html; charset=UTF-8' http-equiv="Content-Type"/>
<title>PrimeFaces</title>
</f:facet>
</h:head>
<h:body>
<p:layout fullPage="true">
<p:layoutUnit position="north" size="100" resizable="true" closable="true" collapsible="true">
Header
</p:layoutUnit>
<p:layoutUnit position="south" size="100" closable="true" collapsible="true">
Footer
</p:layoutUnit>
<p:layoutUnit position="west" size="175" header="Left" collapsible="true">
<h:form id="form">
<p:tree value="#{treeBean.root}" var="node" id="tree">
<p:treeNode id="treeNode">
<h:outputText value="#{node}" id="lblNode"/>
</p:treeNode>
</p:tree>
</h:form>
</p:layoutUnit>
<p:layoutUnit position="center">
Welcome to PrimeFaces
</p:layoutUnit>
</p:layout>
</h:body>
</f:view>
You have to create and copy a TreeBean class too. It is avaible for every example on primefaces showcase site, next to xhtml's source code. To make it visible for EL you have to additionally annotate it #Named or #ManagedBean, and give it some reasonable lifecycle scope.
//EDIT:
#Named
#javax.enterprise.context.SessionScoped
public class TreeBean { ... }
I have a primefaces (version 3.4.2) slider and an inputText for output value of the slider value.
The problem is that a change of the slider update the displayed value of the inputText, but the setter bind to the inputText is not called.
Here is my slider:
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:a4j="http://richfaces.org/a4j">
<h:head>
<title>Zinsrechner</title>
</h:head>
<h:body>
<h:form>
<h:panelGrid columns="1" style="margin-bottom:10px">
<p:inputText id="x" value="#{zinsrechner.monatlicherBeitrag}" />
<p:slider minValue="0" maxValue="150" for="x" />
</h:panelGrid>
</h:form>
</h:body>
</html>
And this is my Setter, which is NOT called:
public void setMonatlicherBeitrag( Double beitrag ) {
monatlicherBeitrag = beitrag;
}
The Getter IS called:
public Double getMonatlicherBeitrag() {
return GuiParameter.getSpareinlageProMonat();
}
Adding a <p:ajax> inside your Slider will to the trick.
Example:
<p:slider minValue="0" maxValue="150" for="x">
<p:ajax event="slideEnd" process="x" />
</p:slider>
I was facing the same problem, but in my case the thing was that I was setting the <p:inputNumber .../> label as read only. I removed that attribute and everything worked.