I am trying to disable the combobox when it processes the ajax event, but it sends null to the bean setter instead of the selected value. It sends the correct value once I remove the code onstart="PF('testA').disable();".
Does anyone have a solution for this. Thanks.
I am using Primefaces 6.2, JSF2.2, Java 7 and Glassfish 4.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:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui">
<h:head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</h:head>
<h:body>
<h:form id="themeForm">
<p:selectOneMenu value="#{selectOneMenuViewA.theme}" widgetVar="testA">
<p:ajax process="#form" event="itemSelect" update=":themeForm:themeId" onstart="PF('testA').disable();" oncomplete="PF('testA').enable()"/>
<f:selectItems value="#{selectOneMenuViewA.themes}" var="theme" itemLabel="#{theme}" itemValue="#{theme}" />
</p:selectOneMenu>
<h:outputText id="themeId" value="#{selectOneMenuViewA.theme}"/>
</h:form>
</h:body>
public class SelectOneMenuViewA {
private String theme;
private List<String> themes;
#PostConstruct
public void init() {
themes = Arrays.asList("a", "b", "c");
}
public String getTheme() {
return theme;
}
public void setTheme(String theme) {
this.theme = theme;
}
public List<String> getThemes() {
return themes;
}
}
I'd like to integrate pe:ckeditor to my XHTML page.
After googling, I found this helpful link
www.primefaces.org/showcase-ext/sections/ckEditor/multipleEditors.jsf
The Bean class is:
package com.esprit.util;
import java.io.Serializable;
import javax.faces.application.FacesMessage;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
import javax.faces.context.FacesContext;
#ManagedBean
#ViewScoped
public class EditorController implements Serializable {
private static final long serialVersionUID = 20111020L;
private String content;
private String secondContent;
private String color = "#33fc14";
public EditorController() {
content = "Hi Showcase User";
secondContent = "This is a second editor";
}
public void saveListener() {
content = content.replaceAll("\\r|\\n", "");
final FacesMessage msg = new FacesMessage(FacesMessage.SEVERITY_INFO, "Content",
content.length() > 150 ? content.substring(0, 100) : content);
FacesContext.getCurrentInstance().addMessage(null, msg);
}
public void secondSaveListener() {
secondContent = secondContent.replaceAll("\\r|\\n", "");
final FacesMessage msg = new FacesMessage(FacesMessage.SEVERITY_INFO, "Second Content",
secondContent.length() > 150 ? secondContent.substring(0, 100) : secondContent);
FacesContext.getCurrentInstance().addMessage(null, msg);
}
public void changeColor() {
if (color.equals("#1433FC")) {
color = "#33fc14";
} else {
color = "#1433FC";
}
}
// Getters & Setters
}
The page XHTML is:
<!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:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:pe="http://primefaces.org/ui/extensions">
<body>
<h:form>
<p:growl id="growl" showDetail="true" />
<pe:ckEditor id="editor"
value="#{editorController.content}"
toolbar="[['Cut','Copy','Paste','PasteText','PasteFromWord','-', 'SpellChecker', 'Scayt']]">
<p:ajax event="save" listener="#{editorController.saveListener()}" update="growl"/>
</pe:ckEditor>
<br/>
<br/>
<pe:ckEditor id="secondEditor"
value="#{editorController.secondContent}"
toolbar="[['Cut','Copy','Paste','PasteText','PasteFromWord','-', 'SpellChecker', 'Scayt']]">
<p:ajax event="save" listener="#{editorController.secondSaveListener()}" update="growl"/>
</pe:ckEditor>
</h:form>
</body>
</html>
The added this to file web.xml:
<context-param>
<param-name>
org.primefaces.extensions.DELIVER_UNCOMPRESSED_RESOURCES
</param-name>
<param-value>false</param-value>
</context-param>
After running my project: I got this screenshot.
As you see, I didn't have the same editor as displayed by the tutorial: I have an Editor without Header.
Have you please any idea about solving this. Any proposition is appreciated. Thanks a lot.
Additional to the attribute toolbar that #ArgaPK mentioned, you have to:
Verify that those required jars exist:
commons-io-2.4.jar
commons-lang3-3.5.jar
gson-2.2.4.jar
primefaces-6.0.jar
primefaces-extensions-6.0.0.jar
resources-ckeditor-6.0.0.jar
Update your XHTML by adding <h:head/>
<!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:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:pe="http://primefaces.org/ui/extensions">
<h:head/>
<h:body>
<h:form style="width: 800px; margin: 0 auto;">
<p:growl id="growl" showDetail="true" />
<pe:ckEditor id="editor" value="#{editorController.content}" toolbar="[['Cut','Copy','Paste','PasteText','PasteFromWord','-', 'SpellChecker', 'Scayt']]">
<p:ajax event="save" listener="#{editorController.saveListener}" update="growl"/>
</pe:ckEditor>
<br/>
<br/>
<pe:ckEditor id="secondEditor" value="#{editorController.secondContent}" toolbar="[['Cut','Copy','Paste','PasteText','PasteFromWord','-', 'SpellChecker', 'Scayt']]">
<p:ajax event="save" listener="#{editorController.secondSaveListener}" update="growl"/>
</pe:ckEditor>
</h:form>
</h:body>
</html>
HTH
You have to add the toolbar attribute
<p:growl id="growl" showDetail="true" />
<pe:ckEditor id="editor" value="#{editorController.content}" toolbar="[['Cut','Copy','Paste','PasteText','PasteFromWord','-', 'SpellChecker', 'Scayt']]">
<p:ajax event="save" listener="#{editorController.saveListener}" update="growl"/>
</pe:ckEditor
<br/>
<br/>
<pe:ckEditor id="secondEditor" value="#{editorController.secondContent}" toolbar="[['Cut','Copy','Paste','PasteText','PasteFromWord','-', 'SpellChecker', 'Scayt']]">
<p:ajax event="save" listener="#{editorController.secondSaveListener}" update="growl"/>
</pe:ckEditor>
and add the following dependency also:
<dependency>
<groupId>org.primefaces.extensions</groupId>
<artifactId>primefaces-extensions</artifactId>
<version>6.0.0</version>
</dependency>
<dependency>
<groupId>org.primefaces.extensions</groupId>
<artifactId>resources-ckeditor</artifactId>
<version>6.0.0</version>
</dependency>
see this helfull link
Getting started with primefaces extensions
I'm using poll component of primefaces 5.1
I've jsf2 page like
<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:pe="http://primefaces.org/ui/extensions">
<ui:composition template="/templates/securedContent.xhtml">
<ui:define name="content">
<h:form id="form">
<p:poll interval="1"
listener="#{counterView.increment}" update=":form" />
<p:outputLabel value="#{counterView.number}" />
</h:form>
</ui:define>
</ui:composition>
</html>
and the bean is :
package main.com.zc.project.presentation.attendance.bean;
import java.io.Serializable;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
import javax.faces.event.ActionEvent;
#ManagedBean
#ViewScoped
public class CounterView implements Serializable {
private int number;
public int getNumber() {
return number;
}
public void increment() {
number++;
}
}
I'm using primefaces 5.1 , and the poll doesn't call Bean method as expected could anyone help me please?
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'm trying to use primefaces dialog framework to simplify my code. I've followed the example in the primefaces 4.0 user guide and it's not working.
I copied the example pretty much verbatim creating three files: a file with the dialog in it, a file that calls the dialog and a backing bean file.
The dialog file is named "dialog.xhtml", is in the "/Test" folder and contains:
<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>Cars</title>
</h:head>
<h:body>
Test dialog
</h:body>
</html>
The base file is named "testDialog.xhtml", is in the "/Test" folder and contains:
<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>Test Dialog</title>
<meta name="viewport" content="width=device-width"/>
</h:head>
<h:body>
<h:form>
<p:commandButton value="View Cars" actionListener="#{hostBean.view}" />
</h:form>
</h:body>
</html>
Finally, the backing bean contains:
#ManagedBean
#SessionScoped
public class HostBean implements Serializable {
public void view() {
RequestContext.getCurrentInstance().openDialog("/Test/dialog");
}
}
When I debug it, view gets called but the dialog is not opened. (I have added the three lines to faces-context.)
Any ideas?
I made it work with this code:
import java.io.Serializable;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
import org.primefaces.context.RequestContext;
#ManagedBean
#ViewScoped
public class HostBean implements Serializable {
public void view() {
RequestContext.getCurrentInstance().openDialog("dialog");
}
}
As both xhtml files are in the same folder (Test) you don't need to use "/Test/dialog" (you can make it more "global" if you use the whole path though).
Don't forget to add this to your faces-config.xml:
<?xml version='1.0' encoding='UTF-8'?>
<faces-config version="2.2"
xmlns="http://xmlns.jcp.org/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-facesconfig_2_2.xsd">
<application>
<action-listener>org.primefaces.application.DialogActionListener</action-listener>
<navigation-handler>org.primefaces.application.DialogNavigationHandler</navigation-handler>
<view-handler>org.primefaces.application.DialogViewHandler</view-handler>
</application>
</faces-config>
You must add to the header of your page this line:
<h:outputScript name="jquery/jquery-plugins.js" library="primefaces"/>
Don't worry - do not copy any files to your project - above line is enough because PrimeFaces automatically adds js file.
As you realized you must also add few lines to your faces-config.xml file:
<application>
<action-listener>org.primefaces.application.DialogActionListener</action-listener>
<navigation-handler>org.primefaces.application.DialogNavigationHandler</navigation-handler>
<view-handler>org.primefaces.application.DialogViewHandler</view-handler>
</application>