What I need to do call I dialog from a ManagedBean, exactly like this show case:
http://www.primefaces.org/showcase/ui/df/basic.xhtml
It looks very trivial but I'm new to JSF and maybe there is something the showcase assumes I should know to make it work.
what I did was quite similar to showCase:
file myDialog.xhtml
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui">
<h:head>
<title>Dialog Test</title>
<style type="text/css">
.ui-widget {
font-size: 90%;
}
</style>
</h:head>
<h:body>
<h1>Dialog Working</h1>
</h:body>
</html>
In the page "client" page:
<p:commandButton value="Open Dialog" ajax="true"
actionListener="#{testMB.open}"
/>
public void open() {
RequestContext.getCurrentInstance().openDialog("myDialog");
}
When I try to call the dialog nothing happens!
In the Firebug Console I got the "Widget for var 'widget_frmBody_j_idt88' not available!"
I noticed the .xhtml file from showCase does not have a so I tried this approach:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui">
<p:dialog widgetVar="testDialog">
<h1>This is a Dialog</h1>
</p:dialog>
</html>
RequestContext rc = RequestContext.getCurrentInstance();
rc.execute("PF('testDialog').show()");
And I got:
TypeError: PF(...) is undefined jquery.js:1
"Widget for var 'testDialog' not available!"
What can I do to make it works please???
This is my example for you.
XHTML
<h:form>
<h:panelGrid columns="1" cellpadding="1">
<p:commandButton value="Basic"
process="#this"
update="#form"
actionListener="#{dialogView.openDialog}"/>
</h:panelGrid>
<p:dialog header="Basic Dialog"
widgetVar="dlg1"
minHeight="40">
<h:outputText value="Dialog open!" />
</p:dialog>
</h:form>
ManagedBean
public void openDialog() {
RequestContext rc = RequestContext.getCurrentInstance();
rc.execute("PF('dlg1').show()");
}
Related
I have multiple pages, and on some, the FacesMessage appears, while on others they don't. But I can't figure out why. In my example below, ajax is at false, but on some ajax is at true like everywhere else, but not working even it's same code
In every case the method is called, log proves it, but the message did not show in some case
I have a menu bar, which is included on top of every page, as
<html xmlns="http://www.w3.org/1999/xhtml" xlmns:h="http://java.sun.com/jsf/html" xlmns:f="http://java.sun.com/jsf/core" xlmns:ui="http://java.sun.com/jsf/facelets" xlmns: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>LOG</title>
</f:facet>
<h:body>
<p:growl showDetail="true" sticky="true">
<p:autoUpdate disabled="false" />
</p:growl>
...
<p:layout>
<p:layoutUnit position="center">
<ui:insert name="center" />
</p:layoutUnit>
</p:layout>
</h:body>
</f:view>
</html>
And working page is like
<!DOCTYPE HTML PUBLIC>
<ui:composition template="/menu.xhtml" xmlns="http://www.w3.org/1999/xhtml"
xlmns:h="http://java.sun.com/jsf/html" xlmns:f="http://java.sun.com/jsf/core"
xlmns:ui="http://java.sun.com/jsf/facelets" xlmns:p="http://primefaces.org/ui">
<ui:define name="center>
<h:form >
<p:commandButton action="#{firstBean.method()}" />
</h:form>
</ui:define>
</ui:composition>
Not working page is like (here ajax at false, but there is also non-working page with ajax true) :
<!DOCTYPE HTML PUBLIC>
<ui:composition template="/menu.xhtml" xmlns="http://www.w3.org/1999/xhtml"
xlmns:h="http://java.sun.com/jsf/html" xlmns:f="http://java.sun.com/jsf/core"
xlmns:ui="http://java.sun.com/jsf/facelets" xlmns:p="http://primefaces.org/ui">
<ui:define name="center>
<h:form enctype="mulipart/form-data" >
<h:inputFile value="#{secondBean.inputFile}" />
<p:commandButton ajax="false" action="#{secondBean.method()}" process="#form" />
</h:form>
</ui:define>
</ui:composition>
And both method() are 100% same :
public void method(){
new JSFUtils().sendMessage("Test 1");
Logger.getAnonymousLogger().severe("Test"); // Always worked, always called
//...
}
Where I have an util class
public calss JSFUtil{
public void sendMessage(String msg){
FacesContext.getCurrentInstance().addMessage(null, new FacesMessage(Faces.Message.SEVERITY_WARN, "Warn", msg));
}
}
I'm having this really weird issue where my commandLinkonly work if I have BOTH links in the same view.
Works fine, both links:
<ui:composition template="../../template.xhtml" xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://xmlns.jcp.org/jsf/core"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
<ui:define name="content">
<h:form>
<p:dataTable var="v" value="#{myBean.myList}">
<p:column headerText="Name">
<h:commandLink value="Go to next page" action="#{myBean.doThing(v)}" />
<p:commandLink value="Go to next page" action="#{myBean.doThing(v)}" />
</p:column>
</p:dataTable>
<p:commandButton value="Submit" ajax="false" actionListener="#{myBean.submit}" />
</h:form>
</ui:define>
</ui:composition>
But if I remove either link, it doesn't even reach the method doThing() and reloads an empty page.
My bean:
#ManagedBean(name="myBean")
#RequestScoped
public class MyBean {
private List<Object> myList = new ArrayList<>();
public MyBean() {
}
public String doThing(Object obj) {
// This never prints if I remove one of the links
System.out.println("You're doing the thing!");
return "nextView?faces-redirect=true"
}
// Getters, setters etc.
}
I'm using JSF 2.0 and GlassFish 4.0.
How can I fix this and why is it happening?
I have a commandLink in a p:dataTable in another view and it's working fine.
EDIT:
Added the complete XML for the composition part of the view. The partial is inside a template:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
<h:head>
<!-- css imports, titles etc -->
</h:head>
<h:body>
<ui:insert name="menu">
<ui:include src="./default/content.xhtml" />
</ui:insert>
</h:body>
</html>
I've already search trhough other posts for a solution to my problem with no luck, so im posting here. My problem is that primefaces dialog is not showing where it should, at the center of the page, at rare times it does(dont understand why), it works fine but its showing at the left top corner, and if i change the option "draggable" from false to true, the dialog stops working... i call the dialog from a managed bean.
this is the code:
form where i call it:
<h:form style="margin-top: 2%;">
<p:commandButton value="Create Ticket" icon="ui-icon-extlink" action="# {ticketBean.viewCreateCustomized}"/>
</h:form>
ManagedBean that contains the dialog method:
#ManagedBean
#ViewScoped
public class TicketBean implements Serializable {
public void viewTicketCustomized() {
Map<String,Object> options = new HashMap<String, Object>();
options.put("modal", true);
options.put("draggable", false);
options.put("resizable", false);
options.put("contentHeight", 320);
RequestContext.getCurrentInstance().openDialog("createticket", options, null);
}
UPDATE: this is the view that the dialog shows:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://xmlns.jcp.org/jsf/core">
<h:head>
<h:outputScript name="jquery/jquery-plugins.js" library="primefaces"/>
<title>Create New Account</title>
<link href="#{request.contextPath}/css/simple.css" rel="stylesheet" type="text/css"/>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
$(window).load(function() {
$(".loader").fadeOut("slow");
});
</script>
<style type="text/css">
.ui-widget {
font-size: 110%;
}
</style>
</h:head>
<f:view>
<center><h:form style="margin-top: 2%;">
<p:growl id="msg" showDetail="true"/>
<p:panelGrid columns="2">
<f:facet name="header">Create New Ticket</f:facet>
<h:outputText value="Description:" />
<p:inputTextarea value="#{ticketBean.description}"/>
<h:outputText value="Note:" />
<p:inputTextarea value="#{ticketBean.note}"/>
<f:facet name="footer"><p:commandButton value="Create Ticket" action="# {ticketBean.createTicket}" update="msg"/></f:facet>
</p:panelGrid>
</h:form></center>
</f:view>
</html>
I'm not sure what browser you are using or if your problem is related to the browser at all. But I tried your code and did not succeed to show the dialog. However, when I changed it to the following it worked:
<h:form style="margin-top: 2%;">
<p:commandButton value="Create Ticket" icon="ui-icon-extlink" onclick="test.show();"/>
<p:dialog modal="true" widgetVar="test" draggable="true" resizable="false" contentHeight="320">
</p:dialog>
</h:form>
I'm not sure if there is a reason you have to show the dialog from the managed bean, but if you do, then instead of "onclick.show()" you can do the following:
<h:form style="margin-top: 2%;">
<p:commandButton value="Create Ticket" icon="ui-icon-extlink" action="#{ticketBean.viewTicketCustomized()}"/>
<p:dialog modal="true" widgetVar="test" draggable="true" resizable="false" contentHeight="320">
</p:dialog>
</h:form>
and in your managed bean:
#ManagedBean
#ViewScoped
public class TicketBean implements Serializable {
public void viewTicketCustomized() {
RequestContext context = RequestContext.getCurrentInstance();
context.execute("test.show();");
}
this is the page where i call dialog on openDialog metod
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core">
<h:head>
<meta content='text/html; charset=UTF-8' http-equiv="Content-Type"/>
</h:head>
<h:body>
<h:form>
<p:commandButton value="OpenDialog" action="#{cnt.openDialog()}"/>
</h:form>
</h:body>
</html>
and my dialog page is
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core">
<h:head>
<meta content='text/html; charset=UTF-8' http-equiv="Content-Type"/>
</h:head>
<h:body>
<h:form id="insModForm">
<p:panel id="searchCitizenPanel" header="Just Panel" >
<h:panelGrid columns="2">
<h:outputText value="name"/>
<p:inputText value="#{iamasCnt.citizen.name}"/>
<h:outputText value="surname"/>
<p:inputText value="#{iamasCnt.citizen.surname}"/>
<h:outputText value="bdate"/>
<p:calendar value="#{iamasCnt.citizen.bdate}"/>
<h:outputText value=""/>
<p:commandButton value="check" action="#{cnt.searchThis()}" />
</h:panelGrid>
</p:panel>
</h:form>
</h:body>
and CDI where i call prime faces framework dialog
#Named("cnt")
#SessionScoped
public class IAMASController implements Serializable {
public void openDialog() {
logger.info("// opendialog");
Map<String, Object> options = new HashMap<String, Object>();
options.put("modal", true);
options.put("draggable", false);
options.put("resizable", false);
options.put("contentHeight", 720);
options.put("contentWidth", 720);
RequestContext.getCurrentInstance().openDialog("/dialogTest/dialog", options, null);
}
}
i'm newly using primefaces dialog framework got some problems
problem is p:commandButton action searchThis() invokes each time when i open prime faces dialog
I find it! There was such a weird situation
i put comment next to
<p:commandButton value="check" action="#{cnt.searchThis()}"/><!-- action="#{iamasCnt.hiddenSearch()}"-->
due to jsf problem hiddenSearch() action in comment invoked each time when dialog loads so i took off this comment everything works fine
I'm trying to understand why a viewscoped view is recreating on every ajax call.
I have a test case, and it's working fine without composition templating.
I find questions that seem similar to my problem but the solutions don't work for me, like setting javax.faces.PARTIAL_STATE_SAVING to false or javax.faces.STATE_SAVING_METHOD to client.
Here's a sample:
page.xhtml
<?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:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:ui="http://java.sun.com/jsf/facelets"
>
<h:body>
<h:form id="pageForm">
<p:commandButton
value="Choose an option..."
actionListener="#{pageController.handleOptionChoose}"
update="selectedOption"
/>
<br/>
<h:panelGrid columns="2" cellpadding="3">
<p:outputLabel for="selectedOption" value="Selected option: "/>
<p:outputLabel id="selectedOption" value="#{pageController.selectedOption}"/>
</h:panelGrid>
<br/><br/>
<p:commandButton
value="Edit option"
actionListener="#{pageController.doAnythingWithTheOption}"
update="editedOption"
/>
<br/>
<h:panelGrid columns="2" cellpadding="3">
<p:outputLabel for="editedOption" value="Edited option: "/>
<p:outputLabel id="editedOption" value="#{pageController.editedOption}"/>
</h:panelGrid>
</h:form>
<p:dialog
id="dialogOption_Dialog"
header="Choose an option"
widgetVar="dialogOption_Widget"
modal="true"
appendTo="#(body)"
>
<h:form id="dialogOption_Form">
<h:panelGrid columns="1">
<p:selectOneButton id="dialogOptionChoose" value="#{pageController.selectedOption}" >
<f:selectItem itemLabel="Option 1" itemValue="Option 1" />
<f:selectItem itemLabel="Option 2" itemValue="Option 2" />
<f:selectItem itemLabel="Option 3" itemValue="Option 3" />
</p:selectOneButton>
<p:spacer width="0" height="20" />
<p:commandButton
value="Done"
action="#{pageController.showOption}"
update=":pageForm:selectedOption"
oncomplete="dialogOption_Widget.hide();"
/>
</h:panelGrid>
</h:form>
</p:dialog>
</h:body>
</html>
content.xhtml
<?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:c="http://java.sun.com/jstl/core"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:mj="http://mojarra.dev.java.net/mojarra_ext"
xmlns:o="http://omnifaces.org/ui"
xmlns:of="http://omnifaces.org/functions">
<h:body>
<ui:composition template="/layout.xhtml">
<ui:define name="content">
<ui:include src="page.xhtml" />
</ui:define>
</ui:composition>
</h:body>
</html>
layout.xhtml
<!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"
xmlns:o="http://omnifaces.org/ui"
xmlns:of="http://omnifaces.org/functions">
<f:view contentType="text/html" transient="true">
<h:head>
<h:outputStylesheet name="theme.css" library="css" />
<f:facet name="first">
<f:metadata>
<meta http-equiv="X-UA-Compatible" content="IE=8" />
</f:metadata>
<title>Teste</title>
<link rel="icon" type="image/png" href="resources/css/icons/favicon.ico" />
</f:facet>
</h:head>
<h:body>
<p:layout fullPage="true" >
<p:layoutUnit id="top" position="north" size="50" style="border: 2px solid Black !important;">
<!-- <ui:insert name="menubar" /> -->
</p:layoutUnit>
<p:layoutUnit id="center" position="center" style="border: 2px solid Black !important;">
<ui:insert name="content" />
</p:layoutUnit>
<p:layoutUnit id="bottom" position="south" size="60" resizable="true" collapsible="true" style="border: 2px solid Black !important;">
<!-- <ui:insert name="footer" /> -->
</p:layoutUnit>
</p:layout>
</h:body>
</f:view>
</html>
PageController.java
package com.ericsantanna.grendel.mBeans;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
import org.primefaces.context.RequestContext;
/**
* #author Eric Sant'Anna
*
*/
#ManagedBean
#ViewScoped
public class PageController {
private String selectedOption;
private String editedOption;
public PageController() {
System.out.println("RECREATING VIEW");
}
public void showOption() {
System.out.println("Selected option number: " + selectedOption.substring(7));
}
public void doAnythingWithTheOption() {
System.out.print("Trying to a substring in the selected option: ");
editedOption = selectedOption.substring(7);
System.out.println(editedOption);
}
public void handleOptionChoose() {
RequestContext.getCurrentInstance().execute("dialogOption_Widget.show();");
}
public String getSelectedOption() {
return selectedOption;
}
public void setSelectedOption(String selectedOption) {
this.selectedOption = selectedOption;
}
public String getEditedOption() {
return editedOption;
}
public void setEditedOption(String editedOption) {
this.editedOption = editedOption;
}
}
JBoss log (setup):
17:45:29,494 INFO [org.jboss.ejb.client] (MSC service thread 1-7) JBoss EJB Client version 1.0.5.Final
17:45:29,550 INFO [javax.enterprise.resource.webcontainer.jsf.config] (MSC service thread 1-8) Inicializando Mojarra 2.2.4 ( 20131003-1354 https://svn.java.net/svn/mojarra~svn/tags/2.2.4#12574) para o contexto '/JobSchedulerWeb'
17:45:30,344 INFO [org.hibernate.validator.util.Version] (MSC service thread 1-8) Hibernate Validator 4.2.0.Final
17:45:30,367 INFO [org.primefaces.webapp.PostConstructApplicationEventListener] (MSC service thread 1-8) Running on PrimeFaces 4.0
17:45:30,368 INFO [org.omnifaces.eventlistener.VersionLoggerEventListener] (MSC service thread 1-8) Using OmniFaces version 1.5
To reproduce this code, simply choose an option and click "Edit option" to do a substring in the backing bean, only to get a NullPointerException when using facelets templating. (Look at the console in each step)
Anyone can help?
This,
<f:view ... transient="true">
turns off JSF state saving for the current view. Essentially, this JSF view is stateless. As there's no view state, there's no means of a view scope and the logical consequence is that the view scoped bean instance can't be saved anywhere. It'll disappear in nowhere by end of the request and thus behave like a request scoped bean.
The observed symptoms are thus fully expected. If that wasn't your intent, then you need to remove the transient="true" attribute. It defaults to false.
This has completely nothing to do with templating. The <ui:composition> plays no significant role here. You'd have had exactly the same problem when merging the templates into a single template without <ui:composition>, <ui:define>, etc while keeping the same markup.
See also:
Why JSF saves the state of UI components on server?
javax.faces.application.ViewExpiredException: View could not be restored