Primefaces datatable and ViewScoped - primefaces

I'm using primefaces 5.0 on wildfly 8.2.0 (mojarra 2.2.8).
I tried to use a simple primefaces datatable with expansion but each time I expand a row, my backed bean #PostConstruct is triggered (which reloads the data which nullifies the use of #ViewScoped in the first place).
I've seen other questions on stackoverflow about this problem but no solution worked for me:
I'm using JSF 2.2+
I'm not using any JSTL tags
I disabled partial state saving in web.xml
I tried using different #ViewScoped (bean, view and even omnifaces'one)
My bean:
#Named
#javax.faces.view.ViewScoped
#SuppressWarnings("serial")
public class TestBean implements Serializable {
private List<String> things;
#PostConstruct
public void initialize() {
System.out.println("initializing...");
this.things = Arrays.asList("michael", "david", "paul");
}
public List<String> getThings() {
return this.things;
}
}
My template:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:f="http://xmlns.jcp.org/jsf/core"
xmlns:p="http://primefaces.org/ui">
<h:head>
<title>Test</title>
</h:head>
<h:body>
<p:dataTable value="#{testBean.things}" var="thing">
<p:column>
<p:rowToggler />
</p:column>
<p:column>
<h:outputText value="#{thing}" />
</p:column>
<p:rowExpansion>
<h:outputText value="#{thing}" />
</p:rowExpansion>
</p:dataTable>
</h:body>
</html>

To work, <p:dataTable> has to be inside a <h:form>.

Related

Primefaces selectCheckboxMenu erratic behavior when deselecting individual checkboxes

In an application based on jsf 2.1 and Primefaces 6.1.5, I have difficulties implementing a <p:selectCheckboxMenu
I simplified the code according to the instructions here How to create a Minimal, Complete, and Verifiable example
My code now looks quite similar to the code in the Primefaces Showcase.
Primefaces Showcase
After much analyzing, I can describe 'erratic' a bit better. When deselecting an item, the item following it is affected. The last item is not affected at all. And the first item can never be deselected. It seems like a bug in the use of indices.
Can anyone confirm this and perhaps suggest a Workaround?
Here is the xhtml:
<?xml version="1.0" encoding="UTF-8"?>
<ui:composition 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">
<h:form id="form">
<p:panel>
<p:selectCheckboxMenu id="testSCM"
value="#{myForm.testList}"
multiple="true"
label="Choose item..."
updateLabel="true">
<f:selectItems var="s" value="#{myForm.testItems}" itemLabel="#{s}" />
</p:selectCheckboxMenu>
</p:panel>
<p:commandButton value="Submit" update="displayItems" oncomplete="PF('itemDialog').show()" style="margin-top:10px;" />
<p:dialog header="Selected Items" modal="true" showEffect="fade" hideEffect="fade" widgetVar="itemDialog" width="250">
<p:outputPanel id="displayItems">
<p:dataList value="#{myForm.statusList}" var="item" emptyMessage="No items selected">
<f:facet name="header">
Status
</f:facet>
#{item}
</p:dataList>
</p:outputPanel>
</p:dialog>
</h:form>
</ui:composition>
And this is the form:
#Named("myForm")
#SessionScoped
public class MyForm implements Serializable {
private String[] testList;
private List<String> testItems;
public String[] getTestList() {
return testList;
}
public void setTestList(String[] testList) {
this.testList = testList;
}
public List<String> getTestItems() {
return testItems;
}
public void setTestItems(List<String> testItems) {
this.testItems = testItems;
}
public void reset() {
testItems = new ArrayList<>();
testItems.add("Item1");
testItems.add("Item2");
testItems.add("Item3");
testItems.add("Item4");
testItems.add("Item5");
testItems.add("Item6");
}
}
The problem was caused by a bug in Primefaces version 6.1.5. The code works fine when downgrading to Version 6.0 or upgrading to Version 6.1.8, which is what I chose to do.
The problem is described in Primefaces issue tracker on github

p:selectOneMenu and p:selectBooleanCheckBox values are not binding in nested p:tabview

This is my xhtml with the main tabview is set dynamic="true" and cache="false"
<?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:pe="http://primefaces.org/ui/extensions">
<h:head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
</h:head>
<h:body>
<h:form id="form">
<p:commandButton id="save" value="save"
action="#{nestedTabviewTestBean.savePersonValues}" process="#form"
update="#form" />
<p:tabView activeIndex="#{nestedTabviewTestBean.activeIndex}" dynamic="true" cache="false"
value="#{nestedTabviewTestBean.tabsList}" var="tab">
<p:ajax event="tabChange" listener="#{nestedTabviewTestBean.tabChangeListener}" update="#form"></p:ajax>
<p:tab title="#{tab.title}">
<p:tabView activeIndex="0">
<p:tab title="testingNestedTabs">
<p:selectOneMenu id="selectOneMenu" value="#{nestedTabviewTestBean.activePerson.title}">
<f:selectItem itemLabel="Mr" itemValue="mr" ></f:selectItem>
<f:selectItem itemLabel="Misses" itemValue="misses" ></f:selectItem>
<f:selectItem itemLabel="Miss" itemValue="miss" ></f:selectItem>
</p:selectOneMenu>
<p:inputText id="name" value="#{nestedTabviewTestBean.activePerson.name}"></p:inputText>
<p:selectBooleanCheckbox id="majorOrMinor"
value="#{nestedTabviewTestBean.activePerson.isMajor}"></p:selectBooleanCheckbox>
</p:tab>
</p:tabView>
</p:tab>
</p:tabView>
</h:form>
</h:body>
</html>
This is my view scoped bean
public class NestedTabviewTestBean {
private List<Tab> tabsList = new ArrayList<>();
private Integer activeIndex = 0;
private List<Person> personsList = new ArrayList<>();
private Person activePerson;
#PostConstruct
public void load() {
Tab tab1 = new Tab();
tab1.setId("tab1");
tab1.setTitle("tab1");
tabsList.add(tab1);
Tab tab2 = new Tab();
tab2.setId("tab2");
tab2.setTitle("tab2");
tabsList.add(tab2);
personsList.add(new Person("mr", "Srikanth", true));
personsList.add(new Person("mr", "Madhu", false));
activePerson = personsList.get(activeIndex);
}
public void tabChangeListener(TabChangeEvent event) {
System.out.println("save start");
activePerson = personsList.get(activeIndex);
System.out.println("title :"+activePerson.getTitle()+": Name:"+activePerson.getName()+" :major :"+activePerson.getIsMajor());
System.out.println("save End");
}
public void savePersonValues() {
System.out.println("save start");
System.out.println("title :"+activePerson.getTitle()+": Name:"+activePerson.getName()+" :major :"+activePerson.getIsMajor());
System.out.println("save End");
}
}
On page load first tab content is loaded by default. Now if I click on save button the drop down values is being set to null and the checkbox value is being set to false always.
If I navigate to the last tab in main tabview and click on save button the values are properly binded.
This is kind of strange issue which I couldn't figure out.
I am using primefaces 4.0 and mojarra jsf 2.2.4
Primefaces tabview is currently a little bit broken (I'm using version 5.1). Try to avoid it or satisfy with dirty workarounds like this one:
Primefaces TabView does not maintain selectOneMenu Values

Primefaces datatable filter doesn't work

I must do something fundamentally wrong, I stripped down the code to the bare minimum with a data table and enabling one column filter and a globe filter.
The funny thing is that the example code from Primefaces works. The only difference to my code should be that it gathers data from a DB rather than generating it in the bean.
I have no more clues why my example doesn't do anything when I type something in the filter would be appreciate any ideas here.
My xhtml:
<!DOCTYPE html>
<html xmlns="http://www.w3c.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui">
<ui:composition template="layout.xhtml">
<ui:define name="title">All Projects</ui:define>
<ui:define name="content">
<p:dataTable var="project" value="#{projectController.allProjects}" widgetVar="projectTable" filteredValue="#{projectController.filteredProjects}">
<f:facet name="header">
<p:outputPanel>
<h:outputText value="Search all fields:" />
<p:inputText id="globalFilter" onkeyup="PF('projectTable').filter()" style="width:150px" />
</p:outputPanel>
</f:facet>
<p:column headerText="Name" filterBy="#{project.name}">
<h:outputText value="#{project.name}" />
</p:column>
<p:column headerText="Priority">
<h:outputText value="#{project.priority}" />
</p:column>
<p:column headerText="Exit">
<h:outputText value="#{project.exitCriteria}" />
</p:column>
</p:dataTable>
</ui:define>
</ui:composition>
My Bean:
package com.apa.projectd.common;
import java.io.Serializable;
import java.util.List;
import javax.annotation.PostConstruct;
import javax.enterprise.context.SessionScoped;
import javax.faces.bean.ManagedBean;
import javax.inject.Inject;
import com.habony.common.Loggable;
import com.habony.projectd.ejbs.ProjectEJB;
import com.habony.projectd.enteties.Project;
#ManagedBean(name="projectController")
#SessionScoped
#Loggable
public class ProjectController implements Serializable{
private static final long serialVersionUID = 8345760187637787728L;
#Inject
private ProjectEJB projectEJB;
private List<Project> filteredProjects;
private List<Project> allProjects;
#PostConstruct
public void loadAllProjects(){
allProjects = projectEJB.getAllProjects();
}
//
// Getters and Setters
//
public List<Project> getFilteredProjects() {
return filteredProjects;
}
public void setFilteredProjects(List<Project> filteredProjects) {
this.filteredProjects = filteredProjects;
}
public void setAllProjects(List<Project> allProjects) {
this.allProjects = allProjects;
}
public List<Project> getAllProjects(){
return allProjects;
}
}
The filters features of p:dataTable need to be wrapped in <h:form> tags for work fine. The code xhtml modified would:
<!DOCTYPE html>
<html xmlns="http://www.w3c.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui">
<ui:composition template="layout.xhtml">
<ui:define name="title">All Projects</ui:define>
<ui:define name="content">
<h:form>
<p:dataTable var="project" value="#{projectController.allProjects}" widgetVar="projectTable" filteredValue="#{projectController.filteredProjects}">
<f:facet name="header">
<p:outputPanel>
<h:outputText value="Search all fields:" />
<p:inputText id="globalFilter" onkeyup="PF('projectTable').filter()" style="width:150px" />
</p:outputPanel>
</f:facet>
<p:column headerText="Name" filterBy="#{project.name}">
<h:outputText value="#{project.name}" />
</p:column>
<p:column headerText="Priority">
<h:outputText value="#{project.priority}" />
</p:column>
<p:column headerText="Exit">
<h:outputText value="#{project.exitCriteria}" />
</p:column>
</p:dataTable>
</h:form>
</ui:define>
</ui:composition>
Please see lazy property this may be that your data not filter.
lazy="true" change lazy=false
finally I figured out that when you use Lazy the filtered data is not stored in other variable as in non lazy implementation, everytime you call a filter the load method is executed, so I had to put the filters also in my Load, also the sorting this is the way when using Lazy.
My mistake !
You should initialize filtredProjects with the same data that contains the ArrayList allProjects like this:
#PostConstruct
public void loadAllProjects(){
allProjects = projectEJB.getAllProjects();
filtredProjects = projectEJB.getAllProjects();
}
Do not use lazy loading when filtering and/or sorting

Input given in JSF page does not set that value to managed bean variable [duplicate]

This question already has answers here:
commandButton/commandLink/ajax action/listener method not invoked or input value not set/updated
(12 answers)
Closed 5 years ago.
Am a newbie to JSF. Am using JSF 2 and primefaces 4.0 in my application. As stated in the Title, the input value given in the xhtml page, does not set the value to the ManagedBean. I have tried all the possible combination.
growlMessage.xhtml
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui">
<h:head>
</h:head>
<h:body>
<h:form>
<p:growl id="growl" showDetail="true" sticky="true" />
<p:panel id="panelID" header="Growl">
<h:panelGrid columns="2" cellpadding="5">
<h:outputLabel for="msg" value="Message:" />
<p:inputText id="msg" value="#{growlView.message}" required="true" />
</h:panelGrid>
<p:commandButton value="Save" actionListener="#{growlView.saveMessage}"/>
</p:panel>
</h:form>
</h:body>
</html>
`
GrowlView.java:
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 GrowlView implements Serializable{
private String message;
public GrowlView() {
}
public String getMessage() {
return message;
}
public void setMessage(String message) {
this.message = message;
}
public void saveMessage(){
System.out.println("##### hello");
System.out.println("#####"+ getMessage());
FacesContext context = FacesContext.getCurrentInstance();
context.addMessage(null, new FacesMessage("Successful", "Your message: "+message));
context.addMessage(null, new FacesMessage("Second message", "Additional Message details"));
}
}
Do you have a good reason to use JSF 2.0 instead of 2.2? You should use CDI instead of JSF managed beans, which is more or less deprecated. So, use
#Named
#ViewScoped
public class GrowlView implements Serializable
Be sure the ViewScoped annotation is from javax.faces.view. And the beginning of the xhtml should use the new namespace:
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:p="http://primefaces.org/ui">
Your commandButton should look like this (according to PrimeFaces showcase):
<p:commandButton value="Save" actionListener="#{growlView.saveMessage}" update="growl"/>
Have you tried setting a larger scope to your managed bean, for example #SessionScoped ?
(just for testing purposes). So you could exclude a possible scope problem.
try this following code: using the process and partialSubmit attributes:
<p:commandButton value="Save" actionListener="#{growlView.saveMessage}" update="growl" process="#form" partialSubmit="true"/>
hy,
change for
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui">
<h:head>
</h:head>
<h:body>
<h:form>
<p:growl id="growl" showDetail="true" sticky="true" autoUpdate="true"/>
<p:panel id="panelID" header="Growl">
<h:panelGrid columns="2" cellpadding="5">
<h:outputLabel for="msg" value="Message:" />
<p:inputText id="msg" value="#{pageView.message}" required="true" />
</h:panelGrid>
<p:commandButton value="Save" action="#{pageView.saveMessage}" update="growl"/>
</p:panel>
</h:form>
</h:body>
</html>
and replace
#ManagedBean
with
#ManagedBean(name="pageView")

Primefaces p:tree when loaded dynamically

I'm using p:tree inside a xhtml which is included dynamically into a tabview of another xhtml. When we change tabs alternatively tree expansion does not work. I'm unable to expand tree by clicking the icon beside the node.
Note: Alternatively it doesn't work. Problem occurs only when dynamic="true" and cache="false" for the tabview in index.xhtml. Complete code is below using which the scenario is easily reproducible.
As I'm using p:tree in many places of my project, I request anybody to provide at least a temporary workaround if this is a bug. I already posted this in primefaces forum. I'm using Primefaces 3.5 with JSF on Tomcat 7.0
index.xhtml
<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:p="http://primefaces.org/ui">
<h:head></h:head>
<h:body>
<p:tabView dynamic="true" cache="false">
<p:tab title="One">
<ui:include src="/one.xhtml" />
</p:tab>
<p:tab title="two" />
</p:tabView>
</h:body>
</html>
one.xhtml
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui">
<h:head>
</h:head>
<h:body>
<p:tree widgetVar="treeStructure" value="#{treeBean.root}" var="node" selectionMode="single" id="tree">
<p:treeNode>
<h:outputText value="#{node}" />
</p:treeNode>
</p:tree>
</h:body>
</html>
TreeBean.java
#ManagedBean
#SessionScoped
public class TreeBean {
private TreeNode root;
public TreeNode getRoot() {
return root;
}
public void setRoot(TreeNode root) {
this.root = root;
}
public TreeBean() {
root = new DefaultTreeNode("Root", null);
TreeNode node0 = new DefaultTreeNode("Node 0", root);
TreeNode node00 = new DefaultTreeNode("Node 0.0", node0);
}
}
Found the solution. It's simple and obvious but struggled though. Remove <h:head></h:head> tag in one.xhtml which is not necessary and is reloading the required js files which are already loaded and very much available. Just keep <h:head></h:head> tag in main page always. Here it's index.xhtml.