hello i was testing out the example given on the official primefaces website an i noticed that my <p:commandButton> does not work well in that once i click it to update a value, it stays highlighted and cannot be clicked again to update the value again. Here is the xhtml file:
<?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:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<script src="http://maps.google.com/maps/api/js?sensor=false"
type="text/javascript"></script>
<h:head>
</h:head>
<h:form>
<h:panelGrid columns="2" cellpadding="5" styleClass="ui-grid">
<h:outputLabel for="basic" value="Basic Spinner: " />
<p:spinner id="basic" value="#{spinnerView.number1}" />
<h:outputLabel for="step" value="Step Factor: " />
<p:spinner id="step" value="#{spinnerView.number2}" stepFactor="0.25" />
<h:outputLabel for="minMax" value="Min/Max: " />
<p:spinner id="minMax" value="#{spinnerView.number3}" min="0" max="100" />
<h:outputLabel for="prefix" value="Prefix: " />
<p:spinner id="prefix" value="#{spinnerView.number4}" prefix="$" min="0" />
<h:outputLabel for="ajaxSpinner" value="Ajax Spinner: " />
<p:outputPanel>
<p:spinner id="ajaxSpinner" value="#{spinnerView.number5}">
<p:ajax update="ajaxSpinnerValue" process="#this" />
</p:spinner>
<h:outputText id="ajaxSpinnerValue" value="#{spinnerView.number5}" style="padding-left: 10px" />
</p:outputPanel>
</h:panelGrid>
<p:commandButton value="Submit" update="display" oncomplete="PF('dlg').show()" />
<p:dialog header="Values" widgetVar="dlg" showEffect="fold" hideEffect="fold">
<h:panelGrid id="display" columns="2" cellpadding="5">
<h:outputText value="Value 1: " />
<h:outputText value="#{spinnerView.number1}" />
<h:outputText value="Value 2: " />
<h:outputText value="#{spinnerView.number2}" />
<h:outputText value="Value 3: " />
<h:outputText value="#{spinnerView.number3}" />
<h:outputText value="Value 4: " />
<h:outputText value="#{spinnerView.number4}" />
<h:outputText value="Value 5: " />
<h:outputText value="#{spinnerView.number5}" />
</h:panelGrid>
</p:dialog>
</h:form>
</html>
And this is the managed bean:
package uk.soton.lostatnight;
import javax.faces.bean.ManagedBean;
#ManagedBean
public class SpinnerView {
private int number1;
private double number2;
private int number3;
private int number4;
private int number5;
public int getNumber1() {
return number1;
}
public void setNumber1(int number1) {
this.number1 = number1;
}
public double getNumber2() {
return number2;
}
public void setNumber2(double number2) {
this.number2 = number2;
}
public int getNumber3() {
return number3;
}
public void setNumber3(int number3) {
this.number3 = number3;
}
public int getNumber4() {
return number4;
}
public void setNumber4(int number4) {
this.number4 = number4;
}
public int getNumber5() {
return number5;
}
public void setNumber5(int number5) {
this.number5 = number5;
}
}
I find this weird so does anyone have any solutions to this problem or is it the cause of something else like the web or pom.xml files and if so how can i fix this?
Related
I have an XHTML page which describes the following user composite component
<?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:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:ui_component="http://java.sun.com/jsf/composite/ui_component" >
<h:body>
<h:form id="mergeform">
<p:separator/>
<p:panelGrid styleClass="tableEdit" style="width: 100%">
<f:facet name="header">
<p:row>
<p:column colspan="2">
<h:outputLabel style="font-size: 20px;" value="1-ое застрахованное лицо" />
</p:column>
<p:column style="text-align: right; width: 20em;">
<p:commandButton style="font-size: 14px;" value="Общий поиск" immediate="true"
onclick="dialogPersonList.show();document.getElementById('mergeform:personNumber').value = '1';dlg22Search.show();"
action="#{mergeBean.updateListPerson}"
oncomplete="dlg22Search.hide();"
update=":mergeform:enpsearchtable mergeform:checkSearch"/>
</p:column>
</p:row>
</f:facet>
<p:row>
<p:column colspan="3">
<ui_component:personTable id="First" form="mergeform" id_link="Second" bean="#{mergeBean}" val="#{mergeBean.merge}" smoChanger="true" >
<f:validator validatorId="FIOValidator" for="FIOValid" />
</ui_component:personTable>
</p:column>
</p:row>
</p:panelGrid>
<p:panelGrid styleClass="tableEdit" style="width: 100%">
<f:facet name="header">
<p:row>
<p:column colspan="2">
<h:outputLabel style="font-size: 20px;" value="2-ое застрахованное лицо" />
</p:column>
<p:column style="text-align: right; width: 20em;">
<p:commandButton style="font-size: 14px;" value="Общий поиск" immediate="true"
onclick="dialogPersonList.show();document.getElementById('mergeform:personNumber').value = '2';dlg22Search.show();"
action="#{mergeBean.updateListPerson}"
oncomplete="dlg22Search.hide();"
update=":mergeform:enpsearchtable mergeform:checkSearch" />
</p:column>
</p:row>
</f:facet>
<p:row>
<p:column colspan="3">
<ui_component:personTable id="Second" bean="#{mergeBean}" val="#{mergeBean.merge.inputData}" smoChanger="true" >
<f:validator validatorId="FIOValidator" for="FIOValid" />
</ui_component:personTable>
</p:column>
</p:row>
</p:panelGrid>
</h:form>
</h:body>
</html>
Component itself is a panelGrid with multiple row. For example, I led the line where the problem occurs. Description validators I also lowered.
<?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:cc="http://java.sun.com/jsf/composite"
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">
<cc:interface>
<cc:attribute name="id" />
<cc:attribute name="bean" />
<cc:attribute name="val" />
<cc:attribute name="id_link" />
<cc:attribute name="form" />
<cc:attribute name="readonly" default="false" />
<cc:attribute name="smoChanger" default="false" />
<cc:editableValueHolder name="FIOValid" targets="Secondname#{cc.attrs.id}" />
<cc:editableValueHolder name="DocValid" targets="DocNum#{cc.attrs.id}" />
<cc:editableValueHolder name="PolValid" targets="PolNum#{cc.attrs.id}" />
<cc:editableValueHolder name="PlaceBirthValid" targets="PlaceBirth#{cc.attrs.id}" />
<cc:editableValueHolder name="EnpValid" targets="Enp#{cc.attrs.id}" />
<cc:editableValueHolder name="OgrnValid" targets="Ogrn#{cc.attrs.id}" />
</cc:interface>
<cc:implementation>
<p:panelGrid id="#{cc.attrs.id}Person" style="font-size: 14px; width: 100%" styleClass="tableEdit" >
<p:row>
<p:column style="width: 180px">
<h:outputLabel for="Secondname#{cc.attrs.id}" value="Фамилия: " />
</p:column>
<p:column>
<p:inputText id="Secondname#{cc.attrs.id}" value="#{cc.attrs.val.secondname}"
readonly="#{cc.attrs.readonly}" >
<p:ajax event="blur" process="#this" update="Secondname#{cc.attrs.id} ErrorsSecondname#{cc.attrs.id}" />
<p:ajax event="blur" listener="#{cc.attrs.bean.changeField}"
update="Secondname#{cc.attrs.id} ErrorsSecondname#{cc.attrs.id}
:#{cc.attrs.form}:#{cc.attrs.id_link}:Secondname#{cc.attrs.id_link}
:#{cc.attrs.form}:#{cc.attrs.id_link}:ErrorsSecondname#{cc.attrs.id_link}"
disabled="#{empty cc.attrs.id_link}" />
</p:inputText>
</p:column>
<p:column>
<h:message showSummary="false" showDetail="true"
style="color: red; font-size: 15px;
text-decoration: underline;"
id="ErrorsSecondname#{cc.attrs.id}"
for="Secondname#{cc.attrs.id}"/>
</p:column>
</p:row>
</p:panelGrid>
</cc:implementation>
</html>
In the bean MergeBean, I describe the listener, which is just an error occurs.
#ManagedBean
#SessionScoped
public class MergeBean implements Serializable {
private Person selectedPerson;
public MergeBean() {
}
public Message getMerge() {
if (this.merge == null) {
this.merge = new Message();
this.merge.setInputData(new Message());
}
return this.merge;
}
public void setMerge(Message merge) {
this.merge = merge;
}
public void changeField(AjaxBehaviorEvent event) {
String id = event.getComponent().getId();
String valStr = ((HtmlInputText) event.getComponent()).getValue().toString();
if (valStr != null && !valStr.isEmpty()) {
String idChange = id.substring(0, id.length() - 5);
UIInput input = (UIInput) UtilsUIXhtml.findComponent(idChange + "Second");
//TODO
Object objTemp = input.getSubmittedValue();
//String tempStr = objTemp.toString();
String cngStr = input.getValue().toString();
if (cngStr == null || cngStr.isEmpty()) {
input.setValue(valStr);
}
}
}
}
I'm trying to bind to the first text input in the first custom component and the method to find the associated text input in the second custom component and check its value to empty and null. But when I insert a row in pery input, the second input into the debugger input.getValue (). ToString () is equal to the value that the user entered, and not the fact that it really is. Why is this happening and how can I get the real value programmatly in the listener?
PS And so I'm looking for the components in the DOM-tree:
public static UIComponent findComponent(final String id) {
FacesContext context = FacesContext.getCurrentInstance();
UIViewRoot root = context.getViewRoot();
final UIComponent[] found = new UIComponent[1];
root.visitTree(new FullVisitContext(context), new VisitCallback() {
#Override
public VisitResult visit(VisitContext context, UIComponent component) {
if (component.getId().equals(id)) {
found[0] = component;
return VisitResult.COMPLETE;
}
return VisitResult.ACCEPT;
}
});
return found[0];
}
I am developing small web app using JSF/PrimeFaces. I am able to call bean from web, however, I am unable to return web. This is what I have:
requestLeave.xhtml
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://java.sun.com/jsf/core">
<h:head>
<title>Request leave</title>
</h:head>
<h:body>
<script language="javascript">
var today = new Date();
document.write(today);
</script>
<h:form id="form" >
<h:panelGrid id= "grid" columns="2" cellpadding="5">
<f:facet name="header">
<p:messages id="msgs" />
</f:facet>
<h:outputLabel for="title" value="Leave Title:" style="font-weight:bold" />
<p:inputText value="#{requestLeave.titleLeave}" required="true" requiredMessage="title is required." />
<h:outputLabel for="type" value="Type:" style="font-weight:bold" />
<p:inputText value="#{requestLeave.typeLeave}" required="true" requiredMessage="type is required." />
<p:commandButton value="Submit" actionListener="#{requestLeave.buttonAction}" />
</h:panelGrid>
</h:form>
</h:body>
</html>
RequestLeave.java
import javax.faces.bean.ManagedBean;
#ManagedBean
public class RequestLeave {
private String titleLeave;
private String typeLeave;
public String getTitleLeave() {
return titleLeave;
}
public void setTitleLeave(String titleLeave) {
this.titleLeave = titleLeave;
}
public String getTypeLeave() {
return typeLeave;
}
public void setTypeLeave(String typeLeave) {
this.typeLeave = typeLeave;
}
public String buttonAction() {
System.out.println("leave title " + titleLeave);
System.out.println("leave type " + typeLeave);
return ("index.jsp");
}
}
With this, I cannot return to index.jsp. Can anyone help me? Thanks in advance.
Change the actionListener attribute to action:
<p:commandButton value="Submit" action="#{requestLeave.buttonAction}" />
More info:
Differences between action and actionListener?
When I click on the button New <p:commandButton actionListener="#{ecritureCtrl.newLine}" value="New" update="dataTableSaisiePiece" oncomplete="addRowOnComplete()" ajax="true"/>, a new row is added to my dataTable on only the first click and the page is refreshed. Several cliques except the first were not refreshes the dataTable. So to see my newly added rows, I use the F5 key to refresh my page. Certainly my update="dataTableSaisiePiece" not work or only works rather the first click.
Here is my page home.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:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<script type="text/javascript">
function addRowOnComplete() {
jQuery('#supercoolnewrow').trigger('click');
}
</script>
<ui:composition template="/resources/template/all.xhtml">
<ui:define name="titre">Saisie</ui:define>
<ui:define name="content">
<p:tabView id="ViewPlan">
<p:tab id="tab2" title="Saisie 1">
<h:outputScript library="js" name="frenchLocale.js" />
<h:form id="formPiece">
<p:panel id="panelSaisie" header="Saisir" style="color: brown;font-size: 15px">
<h:panelGrid columns="3" >
<p:outputLabel for="description" value="Description:" ></p:outputLabel>
<p:inputText id="description" value="#{ecritureCtrl.description}" required="true" label="Description" maxlength="100" size="75">
<f:validateLength maximum="100" />
</p:inputText>
<p:message for="description" />
<p:outputLabel for="date" value="Date:" ></p:outputLabel>
<p:calendar locale="fr" id="date" required="true" label="Date" value="#{ecritureCtrl.date}" />
<p:message for="date" />
<p:outputLabel for="code" value="Code Avant" ></p:outputLabel>
<p:inputText id="code" value="#{ecritureCtrl.code}" required="true" >
</p:inputText>
<p:message for="code" />
</h:panelGrid>
<br/>
<p:dataTable var="line" value="#{ecritureCtrl.lignes}" id="dataTableSaisiePiece" >
<p:column headerText="First Name" style="width:150px">
<p:inputText value="#{line.intituleCompte}" style="width:100%"/>
</p:column>
<p:column headerText="Last Name" style="width:150px">
<p:inputText value="#{line.code}" style="width:100%"/>
</p:column>
</p:dataTable>
</p:panel>
<p:commandButton actionListener="#{ecritureCtrl.newLine}" value="New" update="dataTableSaisiePiece" oncomplete="addRowOnComplete()" ajax="true"/>
</h:form>
</p:tab>
<p:tab id="tab3" title="Saisie 2">
</p:tab>
</p:tabView>
</ui:define>
</ui:composition>
</html>
My ManagedBean:
#ManagedBean (name = "ecritureCtrl")
#SessionScoped
public class EcritureCtrl {
private List<Avant> lignes = new ArrayList<Avant>();
Avant unUser;
private String description;
private Date date;
private String code;
public EcritureCtrl() {
lignes.add(new Avant());
}
public void newLine(ActionEvent actionEvent){
lignes.add(new Avant());
}
}
Could you please help me ?
Thanks in advance.
this seems to work for me
import java.io.Serializable;
import java.util.ArrayList;
import java.util.Date;
import java.util.List;
import javax.annotation.PostConstruct;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
import javax.faces.event.ActionEvent;
#ManagedBean
#SessionScoped
public class EcritureCtrl implements Serializable {
private static final long serialVersionUID = 1L;
private String code;
private Date date;
private String description;
private List<Avant> lignes = new ArrayList<Avant>();
private Avant unUser;
public String getCode() {
return this.code;
}
public Date getDate() {
return this.date;
}
public String getDescription() {
return this.description;
}
public List<Avant> getLignes() {
return this.lignes;
}
public Avant getUnUser() {
return this.unUser;
}
#PostConstruct
private void init(){
this.lignes.add(new Avant());
}
public void newLine(ActionEvent actionEvent) {
this.lignes.add(new Avant());
}
public void setCode(String code) {
this.code = code;
}
public void setDate(Date date) {
this.date = date;
}
public void setDescription(String description) {
this.description = description;
}
public void setLignes(List<Avant> lignes) {
this.lignes = lignes;
}
public void setUnUser(Avant unUser) {
this.unUser = unUser;
}
}
and
<!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">
<h:head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Sorry</title>
</h:head>
<h:body>
<script type="text/javascript">
function addRowOnComplete() {
alert();
}
</script>
<h:form id="formPiece">
<p:messages id="messages" showDetail="true" autoUpdate="true"
closable="true" />
<p:tabView id="ViewPlan">
<p:tab id="tab2" title="Saisie 1">
<p:panel id="panelSaisie" header="Saisir"
style="color: brown;font-size: 15px">
<h:panelGrid columns="3">
<p:outputLabel for="description" value="Description:"></p:outputLabel>
<p:inputText id="description" value="#{ecritureCtrl.description}"
required="true" label="Description" maxlength="100" size="75">
<f:validateLength maximum="100" />
</p:inputText>
<p:message for="description" />
<p:outputLabel for="date" value="Date:"></p:outputLabel>
<p:calendar locale="fr" id="date" required="true" label="Date"
value="#{ecritureCtrl.date}" />
<p:message for="date" />
<p:outputLabel for="code" value="Code Avant"></p:outputLabel>
<p:inputText id="code" value="#{ecritureCtrl.code}"
required="true">
</p:inputText>
<p:message for="code" />
</h:panelGrid>
<br />
<p:dataTable var="line" value="#{ecritureCtrl.lignes}"
id="dataTableSaisiePiece">
<p:column headerText="First Name" style="width:150px">
<p:inputText value="#{line.intituleCompte}" style="width:100%" />
</p:column>
<p:column headerText="Last Name" style="width:150px">
<p:inputText value="#{line.code}" style="width:100%" />
</p:column>
</p:dataTable>
</p:panel>
<p:commandButton actionListener="#{ecritureCtrl.newLine}"
value="New" update="dataTableSaisiePiece" oncomplete="addRowOnComplete()"
ajax="true" />
</p:tab>
<p:tab id="tab3" title="Saisie 2">
</p:tab>
</p:tabView>
</h:form>
</h:body>
</html>
i am using rich notify messages and added all related jars namely
richfaces-components-ui-4.1.0.Final ,
richfaces-core-impl-4.0.0.Final,
standard-1.1.2 ,
jstl-1.2 ,
validation-api-1.0.0.GA ,
richfaces-core-api-4.0.0.Final ,
richfaces-components-api-4.0.0.Final
jsf-impl-2.0.2,
cssparser-0.9.5,
guava-r08,
jhighlight-1.0.
but i am getting class not found exception:org.richfaces.component.NotifyAttributes.
sample.xhtml:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.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:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich">
<rich:panel>
<f:facet name="header">
<h:outputText value="Validation Form" />
</f:facet>
<h:form>
<h:panelGrid columns="3">
<rich:validator event="change">
<h:outputText value="Name:" />
<h:inputText label="Name" id="name" value="#{userBean.name}"
required="true">
<f:validateLength minimum="3" />
</h:inputText>
<rich:message for="name" ajaxRendered="true" />
<h:outputText value="Job:" />
<h:inputText label="Job" id="job" value="#{userBean.job}"
requiredMessage="Job is required">
<f:validateLength minimum="3" maximum="50" />
</h:inputText>
<rich:message for="job" ajaxRendered="true" />
<h:outputText value="Address:" />
<h:inputText label="Address" id="address"
value="#{userBean.address}" requiredMessage="Address is required">
<f:validateLength minimum="10" />
</h:inputText>
<rich:message for="address" ajaxRendered="true" />
<h:outputText value="Zip:" />
<h:inputText label="Zip" id="zip" value="#{userBean.zip}"
requiredMessage="Zip is required">
<f:validateLength minimum="4" maximum="9" />
</h:inputText>
<rich:message for="zip" ajaxRendered="true" />
</rich:validator>
<rich:notifyMessages stayTime="2000" nonblocking="true" escape="false"/>
<f:facet name="footer">
<a4j:commandButton value="Ajax Validate" />
</f:facet>
</h:panelGrid>
</h:form>
</rich:panel>
</ui:composition>
bean class used to set and get bean vlaues.let me know whats wrong with existing code ,along with jars to be added
userBean.java:
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
#ManagedBean
#SessionScoped
public class userBean {
private String name;
private String job;
private String address;
private String zip;
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public String getJob() {
return job;
}
public void setJob(String job) {
this.job = job;
}
public String getAddress() {
return address;
}
public void setAddress(String address) {
this.address = address;
}
public String getZip() {
return zip;
}
public void setZip(String zip) {
this.zip = zip;
}
}
error:
Caused by: java.lang.ClassNotFoundException: org.richfaces.component.NotifyAttributes
i am not getting why this is getting although i added all required jars of richfaces4.0 and above.
notify component is not part of RichFaces 4.0. See Richfaces 4.0 VDL documentation. You have to use version 4.1 or up (for example current version RichFaces 4.3).Note: all richfaces-???.jar(s) should be for the same version of RichFaces.
I have trouble displaying my property details on the dialog, after generating the table. Results are shown, but the selected row is not shown on dialog. I have taken over the example from primefaces show case.
<!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:ui="http://java.sun.com/jsf/facelets">
<h:head>
<title>TODO supply a title</title>
<h:outputStylesheet library="css" name="styles.css" />
</h:head>
<h:body>
Dear customer!
<li>#{userDataManager.displayHotelTypeChoice(userDataManager.hotelChoice)}
</li>
<li>#{userDataManager.displayPaxChoice(userDataManager.pax)}
</li>
<li>You have chosen to check in : #{userDataManager.displayCheckinDate(userDataManager.checkinDate)}
</li>
<li>You have chosen to check out : #{userDataManager.displayCheckoutDate(userDataManager.checkoutDate)}
</li>
<li>Total Days of Stay : #{userDataManager.countNightsBetween(userDataManager.checkinDate,userDataManager.checkoutDate)}
</li>
<li>Total Nights of Stay : #{userDataManager.nights}
</li>
<br>
</br>
<h:form id="form">
<p:dataTable id="hotels" var="room" value="#{propertyDataTable.searchByHotelType
(userDataManager.hotelChoice, userDataManager.pax)}"
rowKey="#{room.propertyID}"
selection="#{propertyDataTable.selectedProperty}"
selectionMode="single"
resizableColumns="true">
<f:facet name="header">
#{userDataManager.displayHotelTypeChoice(userDataManager.hotelChoice)}<br></br>
Please select only one choice
</f:facet>
<p:column headerText="Property ID" >
#{room.propertyID}
</p:column>
<p:column headerText="Accommodation" >
#{room.accommodation}
</p:column>
<p:column headerText="Pax" >
#{room.pax}
</p:column>
<p:column headerText="Stars" >
#{room.stars}
</p:column>
<p:column headerText="Type" >
#{room.type}
</p:column>
<f:facet name="footer">
In total there are #{propertyDataTable.listSize(propertyDataTable.
searchByHotelType(userDataManager.hotelChoice,
userDataManager.pax))} hotels.
<p:commandButton id="viewButton" value="View" icon="ui-icon-search"
update=":form:display" oncomplete="hotelDialog.show()">
</p:commandButton>
</f:facet>
</p:dataTable>
<p:dialog id="dialog" header="Hotel Detail" widgetVar="hotelDialog" resizable="false"
width="200" showEffect="clip" hideEffect="fold">
<h:panelGrid id="display" columns="2" cellpadding="4">
<f:facet name="header">
<!--<p:graphicImage value="/resources/images/#{propertyDataTable.selectedProperty.type}.jpg"/>-->
<p:graphicImage value="/resources/images/Grand.jpg"/>
</f:facet>
<h:outputText value="Accommodation:" />
<h:outputText value="#{propertyDataTable.selectedProperty.accommodation }" />
<h:outputText value="Feature:" />
<h:outputText value="#{propertyDataTable.selectedProperty.feature}" />
<h:outputText value="Stars:" />
<h:outputText value="#{propertyDataTable.selectedProperty.stars}" />
</h:panelGrid>
</p:dialog>
</h:form>
<br></br>
<br></br>
<h:commandButton value="Book"
action="#{navigationController.showPage()}" >
<f:param name="page" value="book" />
</h:commandButton>
<br></br>
<h:commandButton value="HOME"
action="#{navigationController.showPage()}" >
<f:param name="page" value="home" />
</h:commandButton>
</h:body>
</html>
package dataTable;
import irms.entity.accommodation.Property;
import irms.entity.accommodation.Room;
import irms.session.accommodation.PropertySession;
import irms.session.accommodation.ReservationSession;
import java.io.Serializable;
import java.util.ArrayList;
import java.util.List;
import javax.ejb.EJB;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
/**
*
* #author Lawrence
*/
#ManagedBean(name = "propertyDataTable")
#ViewScoped
public class PropertyDataTable implements Serializable{
#EJB
private ReservationSession reservationSession;
#EJB
private PropertySession propertySession;
private List<Property> propertyList;
private int choice;
private Property selectedProperty;
private List<Room> list = new ArrayList();
public PropertyDataTable() {
}
public List<Property> getAllRooms() {
return reservationSession.getAllRooms();
}
public List<Property> searchByHotelType(String hotelType, Integer pax) {
this.propertyList = propertySession.searchByHotelType(hotelType, pax);
return propertyList;
}
public int listSize(List<Property> list){
return list.size();
}
public Room getRoom(String propertyID, Integer roomID) {
return propertySession.findRoom(propertyID, roomID);
}
public List<Room> getRoomList(String propertyID){
return propertySession.getRoomList(propertyID);
}
public ReservationSession getReservationSession() {
return reservationSession;
}
public void setReservationSession(ReservationSession reservationSession) {
this.reservationSession = reservationSession;
}
public PropertySession getPropertySession() {
return propertySession;
}
public void setPropertySession(PropertySession propertySession) {
this.propertySession = propertySession;
}
public List<Property> getPropertyList() {
return propertyList;
}
public void setPropertyList(List<Property> propertyList) {
this.propertyList = propertyList;
}
public int getChoice() {
return choice;
}
public void setChoice(int choice) {
this.choice = choice;
}
public Property getSelectedProperty() {
return selectedProperty;
}
public void setSelectedProperty(Property selectedProperty) {
this.selectedProperty = selectedProperty;
}
public List<Room> getList() {
return list;
}
public void setList(List<Room> list) {
this.list = list;
}
}
You Must add ActionListener in your viewButton commandButton
change your xhtml page 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:p="http://primefaces.org/ui"
xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head>
<title>TODO supply a title</title>
<h:outputStylesheet library="css" name="styles.css" />
</h:head>
<h:body>
Dear customer!
<li>#{userDataManager.displayHotelTypeChoice(userDataManager.hotelChoice)}
</li>
<li>#{userDataManager.displayPaxChoice(userDataManager.pax)}
</li>
<li>You have chosen to check in : #{userDataManager.displayCheckinDate(userDataManager.checkinDate)}
</li>
<li>You have chosen to check out : #{userDataManager.displayCheckoutDate(userDataManager.checkoutDate)}
</li>
<li>Total Days of Stay : #{userDataManager.countNightsBetween(userDataManager.checkinDate,userDataManager.checkoutDate)}
</li>
<li>Total Nights of Stay : #{userDataManager.nights}
</li>
<br>
</br>
<h:form id="form">
<p:dataTable id="hotels" var="room" value="#{propertyDataTable.searchByHotelType
(userDataManager.hotelChoice, userDataManager.pax)}"
rowKey="#{room.propertyID}"
resizableColumns="true">
<f:facet name="header">
#{userDataManager.displayHotelTypeChoice(userDataManager.hotelChoice)}<br></br>
Please select only one choice
</f:facet>
<p:column headerText="Property ID" >
#{room.propertyID}
</p:column>
<p:column headerText="Accommodation" >
#{room.accommodation}
</p:column>
<p:column headerText="Pax" >
#{room.pax}
</p:column>
<p:column headerText="Stars" >
#{room.stars}
</p:column>
<p:column headerText="Type" >
#{room.type}
</p:column>
<f:facet name="footer">
In total there are #{propertyDataTable.listSize(propertyDataTable.
searchByHotelType(userDataManager.hotelChoice,
userDataManager.pax))} hotels.
<p:commandButton id="viewButton" value="View" icon="ui-icon-search"
update=":form:display" oncomplete="hotelDialog.show()">
<f:setPropertyActionListener value="#{room}" target="#{propertyDataTable.selectedProperty}" />
</p:commandButton>
</f:facet>
</p:dataTable>
<p:dialog id="dialog" header="Hotel Detail" widgetVar="hotelDialog" resizable="false"
width="200" showEffect="clip" hideEffect="fold">
<h:panelGrid id="display" columns="2" cellpadding="4">
<f:facet name="header">
<!--<p:graphicImage value="/resources/images/#{propertyDataTable.selectedProperty.type}.jpg"/>-->
<p:graphicImage value="/resources/images/Grand.jpg"/>
</f:facet>
<h:outputText value="Accommodation:" />
<h:outputText value="#{propertyDataTable.selectedProperty.accommodation }" />
<h:outputText value="Feature:" />
<h:outputText value="#{propertyDataTable.selectedProperty.feature}" />
<h:outputText value="Stars:" />
<h:outputText value="#{propertyDataTable.selectedProperty.stars}" />
</h:panelGrid>
</p:dialog>
</h:form>
<br></br>
<br></br>
<h:commandButton value="Book"
action="#{navigationController.showPage()}" >
<f:param name="page" value="book" />
</h:commandButton>
<br></br>
<h:commandButton value="HOME"
action="#{navigationController.showPage()}" >
<f:param name="page" value="home" />
</h:commandButton>
</h:body>
</html>