I have two Boolean type check box in my jsf page from which second check box is made disabled depending upon the first check box status and for first time page loading both the check box are unchecked. I am updating the second check box disable status through script when first check box is checked.Then i am selecting second check box.
But the problem is when i am submitting my page only first check box status is getting updated. This is my Managed Bean
#ManagedBean(name = "checkBoxTest")
#SessionScoped
public class CheckBoxTest {
private boolean check1;
private boolean check2;
public boolean isCheck1() {
return check1;
}
public void setCheck1(boolean check1) {
this.check1 = check1;
}
public boolean isCheck2() {
return check2;
}
public void setCheck2(boolean check2) {
this.check2 = check2;
}
public String update(){
boolean status = this.isCheck1();
boolean status2 = this.isCheck2();
return "checkboxExample.xhtml";
}
}
This is my jsf page
<?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>
<title>JSF tutorial</title>
<link href="css/styles.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/myFunction.js">
</script>
</h:head>
<h:body>
<h2>CheckBox Example</h2>
<h:form id="form">
<h:outputLabel value="First Check"/>
<h:selectBooleanCheckbox name="check1" id="check1" value="# {checkBoxTest.check1}" onclick="changeCheckBox2Status()"> </h:selectBooleanCheckbox>
<h:outputLabel value="Second Check"/>
<h:selectBooleanCheckbox name="check2" id="check2" value="#{checkBoxTest.check2}" disabled="#{checkBoxTest.check1?false:true}"> </h:selectBooleanCheckbox>
<h:commandButton action="#{checkBoxTest.update()}" value="Submit2">
</h:commandButton>
</h:form>
</h:body>
</html>
My script is given below
function changeCheckBox2Status(){
var checkBox1Status = document.getElementById("form:check1");
if(checkBox1Status.checked){
document.getElementById("form:check2").disabled=false;
}
}
Did you try something like:
public void setCheck1(boolean check1) {
this.check1 = check1;
this.check2 = !this.check2;
}
and similarly for the other.
Related
This question already has answers here:
How to choose the right bean scope?
(2 answers)
Closed 4 years ago.
I have an application with a p:selectOneMenu component. This component is used to determine what category of file is being uploaded so I can do some work to it when the file is uploaded.
I implemented the answer from this post and it seems to call my setter methods correctly for fileType. But once the file is submitted and the handleFileUpload method is called, the fileType getter method returns null.
For example, if I select Foo then I get the output
File type changed to: Foo
But when I hit the upload button I get the output
The file type selected is null
When I expect
The file type selected is Foo
What is causing the get method to return two different results and is there a way to fix this?
main.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">
<meta http-equiv="refresh"
content="#{session.maxInactiveInterval};url=index.xhtml" />
<f:view contentType="text/html">
<h:head>
<title>File Upload</title>
</h:head>
<p:layout fullPage="true">
<p:layoutUnit position="center">
<ui:insert name="pagebody" />
</p:layoutUnit>
</p:layout>
</f:view>
</html>
index.xhtml
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<ui:composition 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" template="/templates/main.xhtml">
<ui:define name="pagebody">
<h:body>
<h:form id="uploadform" enctype="multipart/form-data">
<h:panelGrid columns="2" style="margin-bottom:10px" cellpadding="5">
<h:outputText value="File Type:" />
<p:selectOneMenu value="#{uploadBean.fileType}">
<f:selectItem itemLabel="Foo" itemValue="Foo"/>
<f:selectItem itemLabel="Bar" itemValue="Bar"/>
<f:ajax listener="#{uploadBean.changeFileType}" />
</p:selectOneMenu>
</h:panelGrid>
<br />
<p:fileUpload fileUploadListener="#{uploadBean.handleFileUpload}" mode="advanced"/>
</h:form>
</h:body>
</ui:define>
</ui:composition>
UploadBean.java
#RequestScoped
#ManagedBean(name = "uploadBean")
public class UploadBean implements java.io.Serializable {
private static final long serialVersionUID = 1L;
private String fileType = null;
#PostConstruct
public void init() {
}
public void handleFileUpload(FileUploadEvent event){
System.out.println("The file type selected is " + this.getFileType());
}
public String getFileType() {
return fileType;
}
public void setFileType(String fileType) {
this.fileType = fileType;
}
public void changeFileType() {
System.out.println("File type changed to: " + this.getFileType());
}
}
As pointed out by #Kukeltje the issue was that my bean was not properly scoped. Switching from RequestScoped to ViewScoped fixed the issue I was having.
This question already has answers here:
Creating master-detail pages for entities, how to link them and which bean scope to choose
(2 answers)
Closed 6 years ago.
I am using JSF 2.0 and have a simple TestButton.xhtml like below:
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<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:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich">
<h:body>
<h:form>
<h:inputText value="#{employee.empName}"/><br/>
<h:commandButton value="Derive" action="EmployeeTest2" >
<f:param name="Name" value="#{employee.empName}"/>
</h:commandButton>
</h:form>
</h:body>
</ui:composition>
And a Managed bean which is view scoped.
#ManagedBean(name="employee", eager=true)
#ViewScoped
public class Employee implements Serializable{
String empName;
String selectedEmployeeName;
public String getSelectedEmployeeName() {
return selectedEmployeeName;
}
public void setSelectedEmployeeName(String selectedEmployeeName) {
this.selectedEmployeeName = selectedEmployeeName;
}
public Employee() {
super();
}
public String getEmpName() {
return empName;
}
public void setEmpName(String empName) {
this.empName = empName;
}
public void manipulate(){
System.out.println("Manipulate called...");
System.out.println(selectedEmployeeName);
this.selectedEmployeeName = this.selectedEmployeeName + " Jr.";
}
Now on click of button, i navigate to EmployeeTest2.xhtml which has following code :
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<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:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich">
<f:view>
<f:metadata>
<f:viewParam name="Name" value="#{employee.selectedEmployeeName}"/>
<f:event type="preRenderView" listener="#{employee.manipulate}"/>
</f:metadata>
</f:view>
<h:body>
<h:inputText value="#{employee.selectedEmployeeName}"/>
</h:body>
</ui:composition>
i get correctly navigated to EmployeeTest2.xhtml but my parameter value is coming as null. I can see that manipulate method is getting called(sysouts get printed) but selectedEmployeeName is null.
Please advise as to what am i missing.
I already referred to below thread and did same but of no help.
https://stackoverflow.com/questions/20880027/passing-parameters-to-a-view-scoped bean-in-jsf
Update 1: Changed
<h:inputText value="Chris"/>
to
<h:inputText value="#{employee.empName}"/>
Put a breakpoint at setter method for selectedEmployee. Setter is not getting called which means param passing is not working.
Update 2 Please see updated testButton.xhtml
?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<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:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich">
<h:body>
<h:form>
<h:inputText name = "Name" value="#{employee.empName}"/><br/>
<h:commandButton value="Submit" action="EmployeeTest2" >
<f:param name="Name" value="#{employee.empName}"/>
</h:commandButton>
</h:form>
</h:body>
</ui:composition>
The code seems correct, in my opinion you are sending null to the next page because the value of the employee.empName is actually null.
I would debug the getEmpName() method when the TestButton.xhtml is loaded and then additionally check, after you click the button and move on to the next page whether the parameter is present in the url.
UPDATE
Ok the param is actually the value of the input. In that case add name to its definition. You form should look like this:
<h:inputText name="Name" value="#{employee.empName}"/><br/>
<h:commandButton value="Derive" action="EmployeeTest2" />
UPDATE 2
This is a workaround but you can also try this:
#PostConstruct
public void postConstruct(){
Map<String,String> params = FacesContext.getCurrentInstance().getExternalContext().getRequestParameterMap();
setSelectedEmployeeName(params.get("Name"));
}
i'm starting with jsf and i'm having a issue with this project.
The following command don't create a link that i need to go to the next page, only give me "Novo usuário" written on the screen:
<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:f="http://xmlns.jcp.org/jsf/core">
<h:head>
<title>Financeiro</title>
</h:head>
<h:body>
<h1>Financeiro</h1>
<h:form>
<h:commandLink action="#{usuarioBean.novo}">Novo Usuário</h:commandLink>
</h:form>
</h:body>
</html>
I also tried this variation, without success:
<h:commandLink action="#{usuarioBean.novo}" value="Novo usuário"/>
This is the method called by #{usuarioBean.novo}
public class UsuarioBean {
private Usuario usuario = new Usuario();
private String confirmarSenha;
public String novo() {
this.usuario = new Usuario();
this.usuario.setAtivo(true);
return "/publico/usuario";
}
}
P.S. i'm br, so i'm sorry in advance for my english
You're going to want to use the value attribute.
<h:commandLink action="#{action.doActions}" value = "Novo Usuário" />
I'm trying to figure out how to open a dialog box when an element in a pie chart is clicked. I'm new to Primefaces, so most of what I've found in searches are more complex examples than what I'm trying to accomplish. The dialog box is opened using the Dialog Framework. I've been able to open the dialog via a command button no problem, so I'm pretty sure the problem isn't with the dialog itself.
Here's the initial page:
<?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"
>
<body>
<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:s="http://jboss.com/products/seam/taglib"
xmlns:p="http://primefaces.org/ui"
xmlns:pm="http://primefaces.org/mobile"
>
<p:panel header="Dashboard" toggleable="true">
<h:form>
<p:growl id="growl" showDetail="true" />
<h:panelGrid columns="2">
<p:chart type="pie" model="#{dashboardPieChart.pieModel1}" style="width:350px; height:200px" >
<p:ajax event="itemSelect" listener="#{dashboardPieChart.itemSelect}"/>
</p:chart>
</h:panelGrid>
<h:outputText id="out" value="#{dashboardPieChart.seriesText}" />
</h:form>
</p:panel>
<script type="text/javascript">
PrimeFaces.info ('Info message');
PrimeFaces.debug('Debug message');
PrimeFaces.warn ('Warning message');
PrimeFaces.error('Error message');
</script>
</ui:composition>
</body>
</html>
And the backing bean:
package com.company.project.model;
import java.io.Serializable;
import javax.annotation.PostConstruct;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
import org.primefaces.context.RequestContext;
import org.primefaces.event.ItemSelectEvent;
import org.primefaces.model.chart.PieChartModel;
#ManagedBean
#ViewScoped
public class DashboardPieChart implements Serializable {
private static final long serialVersionUID = -9056199453379512637L;
private PieChartModel pieModel1;
private String seriesText;
/*
public DashboardPieChart()
{
init();
}
*/
#PostConstruct
public void init() {
System.out.println("DashboardPieChart - inside init()");
createPieModels();
}
public PieChartModel getPieModel1() {
return pieModel1;
}
private void createPieModels() {
createPieModel1();
}
private void createPieModel1() {
pieModel1 = new PieChartModel();
pieModel1.set("Proposals in Progress", 12);
pieModel1.set("Proposals Completed", 15);
pieModel1.setTitle("Proposals");
pieModel1.setLegendPosition("w");
pieModel1.setDiameter(100);
}
public void itemSelect(ItemSelectEvent event) {
String msgText = "Item Index: " + event.getItemIndex() + ", Series Index:" + event.getSeriesIndex();
System.out.println (msgText);
this.seriesText = msgText;
RequestContext.getCurrentInstance().openDialog("pieChartDrillDownDialog");
}
public String getSeriesText() {
return seriesText;
}
public void setSeriesText(String seriesText) {
this.seriesText = seriesText;
}
}
and this is the dialog I'm trying to open:
<!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:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
xmlns:pm="http://primefaces.org/mobile"
>
<h:head>
<title>Proposal Status Detail</title>
</h:head>
<h:body>
<h:form>
<p:chart type="pie" model="#{dashboardPieChartDrillDown.pieModel}" style="width:350px; height:200px" >
</p:chart>
</h:form>
</h:body>
</html>
I was able to make it work using remoteCommand:
XHTML:
<p:remoteCommand name="fnc" actionListener="#{playgroundController.showDialog()}"/>
<p:chart type="pie" model="#{playgroundController.pieModel1}" style="width:400px;height:300px">
<p:ajax event="itemSelect" listener="#{playgroundController.itemSelect}" oncomplete="fnc()" />
</p:chart>
BEAN:
public void showDialog() {
RequestContext.getCurrentInstance().openDialog("pieChartDrillDownDialog");
}
public void itemSelect(ItemSelectEvent event) {
FacesMessage msg = new FacesMessage(FacesMessage.SEVERITY_INFO, "Item selected",
"Item Index: " + event.getItemIndex() + ", Series Index:" + event.getSeriesIndex());
FacesContext.getCurrentInstance().addMessage(null, msg);
}
I'm try to build application with Primefaces 4.0 and JSF 2.2.5. I need to load content dynamically in accordance with choosen menu item.
Here is my main page:
<?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://xmlns.jcp.org/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head>
<title>Hello, world!</title>
</h:head>
<h:body>
<p:layout fullPage="true">
<p:layoutUnit position="west" size="15%">
<h:form>
<p:commandButton value="List1" action="#{backingBean.setCurrentPage('included.xhtml')}"
update=":mypanel_id" process="#this"/><br/>
<p:commandButton value="List2"/>
</h:form>
</p:layoutUnit>
<p:layoutUnit position="center">
<p:panel id="mypanel_id">
<ui:include src="#{backingBean.page}"/>
</p:panel>
<p:messages autoUpdate="true" showDetail="true" showSummary="true"/>
</p:layoutUnit>
</p:layout>
</h:body>
</html>
And this is included page:
<?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://xmlns.jcp.org/jsf/html"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<h:head>
<title>Hello,world</title>
</h:head>
<h:body>
<h:outputText value="Included page"/>
<h:form>
<ui:repeat value="#{backingBean.items}" var="item">
<p:fieldset legend="item" toggleable="true">
<h:outputText value="#{item}"/>
<ui:param name="it" value="#{item}"/>
<p:commandButton value="Click" style="margin-left: 50px;"
actionListener="#{backingBean.actionListener}"/>
</p:fieldset>
</ui:repeat>
<p:commandButton value="Test" action="#{backingBean.actionListener}"/>
</h:form>
</h:body>
</html>
Command buttons not work. Not with action nor with actionListener. What i'm doing wrong? How to build page with conditionally rendered elements, such as command buttons and fieldsets?
P.S. Forget to say, that my bean have request scope.
Updated:
public class BackingBean {
private List<String> items;
private String currentItem;
private String page;
public BackingBean() {
items = new ArrayList<String>();
}
public List<String> getItems() {
if (items.size() == 0) {
this.fillAndUpdate();
}
return items;
}
public void setItems(List<String> items) {
this.items = items;
}
public void fillAndUpdate() {
for (int i = 0; i < 5; i++) {
items.add("Item " + String.valueOf(i));
}
}
public String getPage() {
return page;
}
public void setPage(String page) {
this.page = page;
}
public void setCurrentPage(String page) {
this.page = page;
}
public void actionListener() {
FacesContext.getCurrentInstance().addMessage(null, new FacesMessage("Test"));
}
}
UPDATED
Ok. I found the error (if someone interested). Because my bean has request scope, when i click the button in right panel my view was updated, but list of items was updated too and became empty (request scope). Now i keep selected menu in the session bean, and return that number when view rendered.
try to add ajax="false" in your command buttons