I am new in this StackOverflow community. I am having a problem that the PrimeFaces data table rowEdit Ajax event is not calling whenever I click on the pencil. I know that there are so many questions in this community, I tried each and every possible solution, but all in vein.
Here is my xhtml code:
<h:body style="background:#333333;">
<div
style="background-color: #e5e5e5; padding: 50px; text-align: center;">
<h:graphicImage value="resources/images/afid.png" width="160"
height="160" />
<h:graphicImage value="resources/images/afid2.png" width="160"
height="160" />
<h1>Armed Forces Institute of Dentistry (AFID), Rawalpindi.</h1>
<hr />
</div>
<h:form>
<h3 style="color: #ffd700; text-align: center">
<u> Search Bills By MR No. </u>
</h3>
<p:outputLabel value="MR No.:" />
<p:inputText value="#{viewBills.mrNo}" placeholder="Search" />
<p:commandButton value="Search" actionListener="#{viewBills.search}"
update="table-wrapper" class="armedForces" style="margin-left: 30px;" />
<p:growl id="msgs" showDetail="true" />
<h:panelGroup id="table-wrapper">
<p:dataTable id="patients" rendered="#{viewBills.visible}"
editable="true" value="#{viewBills.getPatientBills}" var="patient"
style="margin-bottom:20px">
<p:ajax event="rowEdit" Listener="#{viewBills.updateEdited}" />
<p:ajax event="rowEditCancel" Listener="#{viewBills.onRowCancel}" />
<p:column headerText="Name">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{patient.patName}" />
</f:facet>
<f:facet name="input">
<p:inputText id="modelInput" value="#{patient.patName}"
style="width:100%" />
</f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="Department">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{patient.department}" />
</f:facet>
<f:facet name="input">
<p:inputText value="#{patient.department}" style="width:100%" />
</f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="Amount">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{patient.amount}" />
</f:facet>
<f:facet name="input">
<p:inputText value="#{patient.amount}" style="width:100%" />
</f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="Implant">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{patient.implant}" />
</f:facet>
<f:facet name="input">
<p:inputText value="#{patient.implant}" style="width:100%" />
</f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="Ceramic Lab">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{patient.ceramicLab}" />
</f:facet>
<f:facet name="input">
<p:inputText value="#{patient.ceramicLab}" style="width:100%" />
</f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="Comments">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{patient.comments}" />
</f:facet>
<f:facet name="input">
<p:inputText value="#{patient.comments}" style="width:100%" />
</f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="Practical Charges">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{patient.practicalCharges}" />
</f:facet>
<f:facet name="input">
<p:inputText value="#{patient.practicalCharges}"
style="width:100%" />
</f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="Material Charges">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{patient.materialCharges}" />
</f:facet>
<f:facet name="input">
<p:inputText value="#{patient.materialCharges}"
style="width:100%" />
</f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="Fixed Ortho">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{patient.fixedOrtho}" />
</f:facet>
<f:facet name="input">
<p:inputText value="#{patient.fixedOrtho}" style="width:100%" />
</f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="MF Kit">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{patient.mfKit}" />
</f:facet>
<f:facet name="input">
<p:inputText value="#{patient.mfKit}" style="width:100%" />
</f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="Army No">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{patient.armyNo}" />
</f:facet>
<f:facet name="input">
<p:inputText value="#{patient.armyNo}" style="width:100%" />
</f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="Unit">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{patient.unit}" />
</f:facet>
<f:facet name="input">
<p:inputText value="#{patient.unit}" style="width:100%" />
</f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="Armed Forces">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{patient.armedForces}" />
</f:facet>
<f:facet name="input">
<p:inputText value="#{patient.armedForces}" style="width:100%" />
</f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="Options" style="width:50px">
<p:rowEditor />
</p:column>
</p:dataTable>
</h:panelGroup>
<p:dialog header="View Bills" widgetVar="dlg2" modal="true"
height="100">
<h:outputText value="Patient Record Not Found!" />
</p:dialog>
</h:form>
</h:body>
and here is my bean:
/**
*
*/
package com.afid.mb;
import java.io.IOException;
import java.util.ArrayList;
import javax.faces.application.FacesMessage;
import javax.faces.bean.ManagedBean;
import javax.faces.context.ExternalContext;
import javax.faces.context.FacesContext;
import javax.faces.event.ActionEvent;
import javax.faces.view.ViewScoped;
import org.primefaces.event.RowEditEvent;
import com.afid.db.DatabaseHandler;
import com.afid.model.Patient;
/**
* #author yawar
*
*/
#ManagedBean(name = "viewBills")
#ViewScoped
public class ManageViewBIllsBean {
public String mrNo;
public boolean visible = false;
public ArrayList<Patient> getPatientBills = new ArrayList<>();
public ArrayList<Patient> getAllPatientBills = new ArrayList<>();
public void search(ActionEvent event) {
getPatientBills = DatabaseHandler.searchBillByMrNo(mrNo);
if (!getPatientBills.isEmpty()) {
setVisible(true);
} else {
}
}
public ArrayList<Patient> searchAllBills() {
return DatabaseHandler.searchAllBills();
}
public void executeViewAllBills() throws IOException {
ExternalContext ec = FacesContext.getCurrentInstance().getExternalContext();
ec.redirect(ec.getRequestContextPath() + "/viewAllBills.xhtml");
}
public void executeViewBillsByMRNo() throws IOException {
ExternalContext ec = FacesContext.getCurrentInstance().getExternalContext();
ec.redirect(ec.getRequestContextPath() + "/viewBillsByMRNo.xhtml");
}
public void updateEdited(RowEditEvent event) {
System.out.println(" i am in edit");
FacesMessage msg = new FacesMessage("Car Edited", ((Patient) event.getObject()).getPatName());
FacesContext.getCurrentInstance().addMessage(null, msg);
}
public void onRowCancel(RowEditEvent event) {
FacesMessage msg = new FacesMessage("Edit Cancelled", ((Patient) event.getObject()).getPatName());
FacesContext.getCurrentInstance().addMessage(null, msg);
}
public String getMrNo() {
return mrNo;
}
public void setMrNo(String mrNo) {
this.mrNo = mrNo;
}
public ArrayList<Patient> getGetPatientBills() {
return getPatientBills;
}
public ArrayList<Patient> getGetAllPatientBills() {
return getAllPatientBills;
}
public boolean isVisible() {
return visible;
}
public void setVisible(boolean visible) {
this.visible = visible;
}
}
Any type of help would be appreciated
The rowEdit will indeed not be triggered whenever you click the pencil / start editing. It will be triggered when you click the check mark / are done editing.
You can see this happening in the showcase.
Related
I have a datatable with dialog forms nested in a tabView tag....
each row of the datatable has buttons for editing and displaying data in Dialog form...but when i click on the edit or display button, it doesn't fill the form...And i don't know what's wrong with the update property....
I tried also to update the datatable after a create and update process by setting an update property in the forms commanButton but it seems that something is missing...
I also visited this link...update-form-on-hcommandbutton-action
and it doesn't seem to work in my case...maybe because update property is not set corectly.
when i delete the tabView, layout and LayoutUnit tags, it works correctly
Here is my index.xhtml code:
<h:body>
<ui:composition template="/template.xhtml">
<ui:define name="content">
<f:view>
<p:tabView id="tout">
<p:tab title="Identite" id="test">
<p:layout style="min-width:400px;min-height:450px;" id="change">
<p:layoutUnit position="center" id="tester">
/* this Dialog form is for creating a new Antecedent*/
<p:dialog showEffect="drop" hideEffect="drop" id="creation" widgetVar="creation" header="Enregistrer locataire">
<h:form id="creer">
<center>
<p:panelGrid columns="4">
<p:outputLabel value="DateDiagnostic:" for="dateDiagnostic" />
<p:inputText id="dateDiagnostic" value="#{antecedentMBean.antecedent.dateDiagnostic}" title="DateDiagnostic" >
<f:convertDateTime pattern="MM/dd/yyyy HH:mm:ss" />
</p:inputText>
<p:outputLabel value="DateGuerison:" for="dateGuerison" />
<p:inputText id="dateGuerison" value="#{antecedentMBean.antecedent.dateGuerison}" title="DateGuerison" >
<f:convertDateTime pattern="MM/dd/yyyy" />
</p:inputText>
<p:outputLabel value="Allergies:" for="allergies" />
<p:inputText id="allergies" value="#{antecedentMBean.antecedent.allergies}" title="Allergies" />
<p:outputLabel value="Therapie:" for="therapie" />
<p:inputText id="therapie" value="#{antecedentMBean.antecedent.therapie}" title="Therapie" />
</p:panelGrid>
<p:panelGrid columns="1">
<p:outputLabel value="Diagnostique:" for="diagnostique" />
<p:inputTextarea id="diagnostique" value="#{antecedentMBean.antecedent.diagnostique}" title="Diagnostique" autoResize="false" rows="6" cols="83"/>
</p:panelGrid>
<hr/>
</center>
<center>
<p:button icon="fa fa-close" value="Fermer" onclick="PF('creation').hide();
return false" />
<p:commandButton icon="fa fa-trash" id="effacer" value="Effacer" type="reset"/>
<p:commandButton icon="fa fa-save" value="Enregistrer" action="#{antecedentMBean.createAntecedent()}"
update=":formulaire:tbl" oncomplete="PF('creation').hide()" />
</center>
</h:form>
</p:dialog>
<h:form id="formulaire">
/* this Dialog form is for etiting */
<p:dialog showEffect="size" id="modif" hideEffect="size" widgetVar="modif" header="Modification">
<p:outputPanel id="repere" style="text-align:center;">
<center>
<p:panelGrid columns="4">
<p:outputLabel value="DateDiagnostic:" for="dateDiagnostic" />
<p:inputText id="dateDiagnostic" value="#{antecedentMBean.antecedent.dateDiagnostic}" title="DateDiagnostic" >
<f:convertDateTime pattern="MM/dd/yyyy" />
</p:inputText>
<p:outputLabel value="DateGuerison:" for="dateGuerison" />
<p:inputText id="dateGuerison" value="#{antecedentMBean.antecedent.dateGuerison}" title="DateGuerison" >
<f:convertDateTime pattern="MM/dd/yyyy" />
</p:inputText>
<p:outputLabel value="Allergies:" for="allergies" />
<p:inputText id="allergies" value="#{antecedentMBean.antecedent.allergies}" title="Allergies" />
<p:outputLabel value="Therapie:" for="therapie" />
<p:inputText id="therapie" value="#{antecedentMBean.antecedent.therapie}" title="Therapie" />
</p:panelGrid>
<p:panelGrid columns="1">
<p:outputLabel value="Diagnostique:" for="diagnostique" />
<p:inputTextarea id="diagnostique" value="#{antecedentMBean.antecedent.diagnostique}" title="Diagnostique" autoResize="false" rows="6" cols="83"/>
</p:panelGrid>
<hr/>
</center>
<center>
<p:button icon="fa fa-close" value="Fermer" onclick="PF('modif').hide();
return false" />
<p:commandButton icon="fa fa-trash" id="effacer" value="Effacer" type="reset"/>
<p:commandButton icon="fa fa-pencil" value="Modifier" action="#{antecedentMBean.updateAntecedent()}"
update=":formulaire:tbl" onclick="PF('modif').hide()" />
</center>
</p:outputPanel>
</p:dialog>
/* this Dialog form is for displaying a row details */
<p:dialog showEffect="size" hideEffect="size" id="voir" widgetVar="voir" header="Modification">
<p:outputPanel id="view" style="text-align:center;">
<center>
<p:panelGrid columns="4">
<p:outputLabel value="IdAntecedent:"/>
<h:outputText value="#{antecedentMBean.antecedent.idAntecedent}" title="IdAntecedent"/>
<p:outputLabel value="DateDiagnostic:"/>
<h:outputText value="#{antecedentMBean.antecedent.dateDiagnostic}" title="DateDiagnostic">
<f:convertDateTime pattern="MM/dd/yyyy HH:mm:ss" />
</h:outputText>
<p:outputLabel value="DateGuerison:"/>
<h:outputText value="#{antecedentMBean.antecedent.dateGuerison}" title="DateGuerison">
<f:convertDateTime pattern="MM/dd/yyyy HH:mm:ss" />
</h:outputText>
<p:outputLabel value="Allergies:"/>
<h:outputText value="#{antecedentMBean.antecedent.allergies}" title="Allergies"/>
<p:outputLabel value="Therapie:"/>
<h:outputText value="#{antecedentMBean.antecedent.therapie}" title="Therapie"/>
<p:outputLabel value="Diagnostique:"/>
<h:outputText value="#{antecedentMBean.antecedent.diagnostique}" title="Diagnostique"/>
<p:outputLabel value="CreerPar:"/>
<h:outputText value="#{antecedentMBean.antecedent.creerPar}" title="CreerPar"/>
<p:outputLabel
<p:outputLabel value="DateCreer:"/>
<h:outputText value="#{antecedentMBean.antecedent.dateCreer}" title="DateCreer">
<f:convertDateTime pattern="MM/dd/yyyy HH:mm:ss" />
</h:outputText>
<p:outputLabel value="MajPar:"/>
<h:outputText value="#{antecedentMBean.antecedent.majPar}" title="MajPar"/>
<p:outputLabel value="DateMaj:"/>
<h:outputText value="#{antecedentMBean.antecedent.dateMaj}" title="DateMaj">
<f:convertDateTime pattern="MM/dd/yyyy HH:mm:ss" />
</h:outputText>
<p:outputLabel value="IdPatient:"/>
<h:outputText value="#{antecedentMBean.antecedent.idPatient.prenom}" title="IdPatient"/>
</p:panelGrid>
<hr/>
</center>
<p:button icon="fa fa-close" value="Fermer" onclick="PF('voir').hide();
return false" />
</p:outputPanel>
</p:dialog>
/* this commandButton display the create form */
<p:commandButton icon="fa fa-plus" value="Creer"
onclick="PF('creation').show()"/>
/* Here is my dataTable */
<p:dataTable id="tbl" value="#{antecedentMBean.listAllAntecedents()}" var="item"
emptyMessage="Aucun Antecedent trouvee" widgetVar="AntecedentTable"
paginator="true" paginatorTemplate="{CurrentPageReport}
{FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink}
{LastPageLink} {RowsPerPageDropdown} " paginatorPosition="top" rowsPerPageTemplate="5,10"
>
<f:facet name="header">
Liste des Patients
</f:facet>
<p:column>
<f:facet name="header">
<h:outputText value="IdAntecedent"/>
</f:facet>
<h:outputText value="#{item.idAntecedent}"/>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="DateDiagnostic"/>
</f:facet>
<h:outputText value="#{item.dateDiagnostic}">
<f:convertDateTime pattern="MM/dd/yyyy HH:mm:ss" />
</h:outputText>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="DateGuerison"/>
</f:facet>
<h:outputText value="#{item.dateGuerison}">
<f:convertDateTime pattern="MM/dd/yyyy HH:mm:ss" />
</h:outputText>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="Allergies"/>
</f:facet>
<h:outputText value="#{item.allergies}"/>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="Therapie"/>
</f:facet>
<h:outputText value="#{item.therapie}"/>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="Diagnostique"/>
</f:facet>
<h:outputText value="#{item.diagnostique}"/>
</p:column>
<p:column headerText="Action" style="width:18%" exportable="false">
<div class="ui-g">
<div class="ui-g-4">
/* Here are the buttons for editing*/
<p:commandButton icon="fa fa-pencil" update=":formulaire:repere" oncomplete="PF('modif').show()">
<f:setPropertyActionListener value="#{item}" target="#{antecedentMBean.antecedent}" />
</p:commandButton>
</div>
<div class="ui-g-4">
/* Here are the buttons for deleting*/
<p:commandButton icon="fa fa-trash" style="background-color: red" type="button" onclick="PF('cd').show()" />
<p:confirmDialog message="Voulez vous vraiment supprimer cet enregistrer?"
header="Suppression en cours" severity="alert"
widgetVar="cd" global="true" showEffect="bounce" hideEffect="bounce">
<p:commandButton value="Oui" action="#{antecedentMBean.deleteAntecedent()}"
oncomplete="PF('cd').hide()" icon="ui-icon-check">
<f:setPropertyActionListener target="#{antecedentMBean.antecedent}" value="#{item}"/>
</p:commandButton>
<p:commandButton value="Non" onclick="PF('cd').hide();" type="button" icon="ui-icon-close"/>
</p:confirmDialog>
</div>
<div class="ui-g-4">
/* Here are the buttons for displaying*/
<p:commandButton icon="fa fa-binoculars" update=":formulaire:view" oncomplete="PF('voir').show()">
<f:setPropertyActionListener value="#{item}" target="#{antecedentMBean.antecedent}" />
</p:commandButton>
</div>
</div>
</p:column>
</p:dataTable>
</h:form>
</p:layoutUnit>
</p:layout>
</p:tab>
</p:tabView>
</f:view>
</ui:define>
</ui:composition>
</h:body>
An here is my managedbean:
package managedbeans;
import entities.Operation;
import java.io.Serializable;
import java.util.Date;
import java.util.List;
import javax.ejb.EJB;
import javax.inject.Named;
import javax.faces.view.ViewScoped;
import sessions.OperationFacadeLocal;
Named(value = "operationMBean")
#ViewScoped
public class OperationMBean implements Serializable{
#EJB
private OperationFacadeLocal operationFacade;
private List<Operation> operationList;
private Operation operation;
private Date date = new Date();
public OperationFacadeLocal getOperationFacade() {
return operationFacade;
}
public void setOperationFacade(OperationFacadeLocal operationFacade) {
this.operationFacade = operationFacade;
}
public List<Operation> getOperationList() {
return operationList;
}
public void setOperationList(List<Operation> operationList) {
this.operationList = operationList;
}
public Operation getOperation() {
return operation;
}
public void setOperation(Operation operation) {
this.operation = operation;
}
public Date getDate() {
return date;
}
public void setDate(Date date) {
this.date = date;
}
public List<Operation> createOperation(){
operation.setDateCree(getDate());
operation.setDateMaj(getDate());
operationFacade.create(operation);
operationList = operationFacade.findAll();
return operationList;
}
public List<Operation> updateOperation(){
operation.setDateMaj(getDate());
operationFacade.edit(operation);
operationList = operationFacade.findAll();
return operationList;
}
public List<Operation> deleteOperation(){
operationFacade.remove(operation);
operationList = operationFacade.findAll();
return operationList;
}
/**
* Creates a new instance of OperationMBean
*/
public OperationMBean() {
}
}
I'm using PrimeFaces 6.1 Netbeans 8.2 Glassfish 4.1
Hope i've been clear in my question
Thanks in advance!!!
I solve this problem by using WidgetVar instead of id in the update property like this:
<p:commandButton update="widgetVar(element_widgetVar)" />
Thanks to Stackoverflow
i have problem in row selection after applying default filter using primefaces 5.2 and jsf 2.2
Primefaces default filter work fine but when i select row to edit i got a wrong row .
My code is attached below :
<?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">
<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="../template/template.xhtml">
<ui:define name="container clearfix">
<ui:insert>
<h:form id="Type_Utilisateur_Form">
<p:commandLink action="#{typeUtilisateurBean.create()}"
oncomplete="PF('popAddTypeUtilisateur').show();"
style="font-size: 15px;">
Add user type
</p:commandLink>
<p:outputPanel id="Type_Utilisateur_List">
<p:dataTable var="typeUtilisateur"
value="#{typeUtilisateurBean.listTypeUtilisateur}"
widgetVar="Type_Utilisateur_Table" rows="3" paginator="true"
rendered="true" emptyMessage="No records found with given criteria"
>
<f:facet name="header">
<p:outputPanel >
<p:inputText id="globalFilter"
onkeyup="PF('Type_Utilisateur_Table').filter()"
style="width:150px" placeholder="Search fields" />
</p:outputPanel>
</f:facet>
<p:column headerText="User Type designation"
sortBy="#{typeUtilisateur.designationTypeUtilisateur}"
filterBy="#{typeUtilisateur.designationTypeUtilisateur}"
filterStyle="display:none">
<h:outputText
value="#{typeUtilisateur.designationTypeUtilisateur}" />
</p:column>
<p:column headerText="Actions" style="width:120px">
<p:outputPanel>
<p:commandLink action="#{typeUtilisateurBean.getRow()}"
oncomplete="PF('popEditTypeUtilisateur').show();">
<p:graphicImage value="../template/images/file_edit.png"
width="48" height="48"></p:graphicImage>
</p:commandLink>
<p:commandLink action="#{typeUtilisateurBean.delete}"
update=":Type_Utilisateur_Form:Type_Utilisateur_List"
style="float: right;">
<p:graphicImage value="../template/images/file_delete.png"
width="48" height="48"></p:graphicImage>
</p:commandLink>
</p:outputPanel>
</p:column>
</p:dataTable>
</p:outputPanel>
</h:form>
<p:dialog widgetVar="popEditTypeUtilisateur" modal="true"
header="EDIT">
<p:ajax event="close"
update=":Type_Utilisateur_Form:Type_Utilisateur_List" />
<p:outputPanel autoUpdate="true">
<h:form>
<p:panelGrid columns="2" layout="grid">
<h:outputLabel value="User Type designation :" />
<p:inputText id="designationTypeUtilisateur"
value="#{typeUtilisateurBean.typeUtilisateur.designationTypeUtilisateur}" />
</p:panelGrid>
<p:commandButton value="Save" action="#{typeUtilisateurBean.save}"
oncomplete="if (!args.validationFailed) PF('popEditTypeUtilisateur').hide();" />
<p:commandButton value="Cancel"
action="#{typeUtilisateurBean.init}"
oncomplete="PF('popEditTypeUtilisateur').hide();" />
</h:form>
</p:outputPanel>
</p:dialog>
<p:dialog widgetVar="popAddTypeUtilisateur" modal="true" header="Add">
<p:ajax event="close"
update=":Type_Utilisateur_Form:Type_Utilisateur_List" />
<p:outputPanel autoUpdate="true">
<h:form>
<p:panelGrid columns="2" layout="grid">
<h:outputLabel value=" User
Type designation :" />
<p:inputText id="designationTypeUtilisateur"
value="#{typeUtilisateurBean.typeUtilisateur.designationTypeUtilisateur}" />
</p:panelGrid>
<p:commandButton value="Save" action="#{typeUtilisateurBean.save}"
oncomplete="if (!args.validationFailed) PF('popAddTypeUtilisateur').hide();" />
<p:commandButton value="Cancel"
action="#{typeUtilisateurBean.init}"
oncomplete="PF('popAddTypeUtilisateur').hide();" />
</h:form>
</p:outputPanel>
</p:dialog>
</ui:insert>
</ui:define>
</ui:composition>
Here we go with primefaces example:
What is important:
in this code set editable="true"
p:ajax event="rowEdit" and p:ajax event="rowEditCancel" both listeners
f:facet name="output" and f:facet name="input" for display, and
edit a column with p:rowEditor
CODE .xhtml:
<p:dataTable id="cars1" var="car" value="#{dtEditView.cars1}" editable="true" style="margin-bottom:20px">
<p:ajax event="rowEdit" listener="#{dtEditView.onRowEdit}" update=":form:msgs" />
<p:ajax event="rowEditCancel" listener="#{dtEditView.onRowCancel}" update=":form:msgs" />
<p:column headerText="Id">
<p:cellEditor>
<f:facet name="output"><h:outputText value="#{car.id}" /></f:facet>
<f:facet name="input"><p:inputText id="modelInput" value="#{car.id}" style="width:100%"/></f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="Year">
<p:cellEditor>
<f:facet name="output"><h:outputText value="#{car.year}" /></f:facet>
<f:facet name="input"><p:inputText value="#{car.year}" style="width:100%" label="Year"/></f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="Brand">
<p:cellEditor>
<f:facet name="output"><h:outputText value="#{car.brand}" /></f:facet>
<f:facet name="input">
<h:selectOneMenu value="#{car.brand}" style="width:100%">
<f:selectItems value="#{dtEditView.brands}" var="man" itemLabel="#{man}" itemValue="#{man}" />
</h:selectOneMenu>
</f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="Color">
<p:cellEditor>
<f:facet name="output"><h:outputText value="#{car.color}" /></f:facet>
<f:facet name="input">
<h:selectOneMenu value="#{car.color}" style="width:100%">
<f:selectItems value="#{dtEditView.colors}" var="color" itemLabel="#{color}" itemValue="#{color}" />
</h:selectOneMenu>
</f:facet>
</p:cellEditor>
</p:column>
<p:column style="width:32px">
<p:rowEditor />
</p:column>
</p:dataTable>
in my table i have column named actions that contains two icons one for update row and the other for delete row.I like to work like that.I have also iput text in order to filter my table and it's work.but if the function PF('carsTable').filter() is called i cannot get the right row selected !
IistUsers.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">
<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="../template/template.xhtml">
<ui:define name="container clearfix">
<ui:insert>
<h:form id="Type_Utilisateur_Form">
<p:commandLink action="#{typeUtilisateurBean.create()}"
oncomplete="PF('popAddTypeUtilisateur').show();"
style="font-size: 15px;">
Add user type
</p:commandLink>
<p:outputPanel id="Type_Utilisateur_List" rendered="true">
<p:dataTable var="typeUtilisateur"
value="#{typeUtilisateurBean.listTypeUtilisateur}"
widgetVar="Type_Utilisateur_Table" rows="3" paginator="true"
rendered="true" emptyMessage="No records found with given criteria"
filteredValue="#{typeUtilisateurBean.filteredTypeUtilisateur}"
id="Type_Utilisateur_Table"
>
<f:facet name="header">
<p:outputPanel autoUpdate="true">
<p:inputText id="globalFilter"
onkeyup="PF('Type_Utilisateur_Table').filter()"
style="width:150px" placeholder="Search fields" />
</p:outputPanel>
</f:facet>
<p:column headerText="User Type designation"
sortBy="#{typeUtilisateur.designationTypeUtilisateur}"
filterBy="#{typeUtilisateur.designationTypeUtilisateur}"
filterStyle="display:none" filterMatchMode="contains">
<h:outputText
value="#{typeUtilisateur.designationTypeUtilisateur}" />
</p:column>
<p:column headerText="Actions" style="width:120px">
<p:outputPanel>
<p:commandLink action="#{typeUtilisateurBean.getRow()}"
oncomplete="PF('popEditTypeUtilisateur').show();"
>
<p:graphicImage value="../template/images/file_edit.png"
width="48" height="48"></p:graphicImage>
</p:commandLink>
<p:commandLink action="#{typeUtilisateurBean.delete}"
update=":Type_Utilisateur_Form:Type_Utilisateur_List"
style="float: right;">
<p:graphicImage value="../template/images/file_delete.png"
width="48" height="48"></p:graphicImage>
</p:commandLink>
</p:outputPanel>
</p:column>
</p:dataTable>
</p:outputPanel>
</h:form>
<p:dialog widgetVar="popEditTypeUtilisateur" modal="true"
header="EDIT">
<p:ajax event="close"
update=":Type_Utilisateur_Form:Type_Utilisateur_List" />
<p:outputPanel autoUpdate="true">
<h:form>
<p:panelGrid columns="2" layout="grid">
<h:outputLabel value="User Type designation :" />
<p:inputText id="designationTypeUtilisateur"
value="#{typeUtilisateurBean.typeUtilisateur.designationTypeUtilisateur}" />
</p:panelGrid>
<p:commandButton value="Save" action="#{typeUtilisateurBean.save}"
oncomplete="if (!args.validationFailed) PF('popEditTypeUtilisateur').hide();" />
<p:commandButton value="Cancel"
action="#{typeUtilisateurBean.init}"
oncomplete="PF('popEditTypeUtilisateur').hide();" />
</h:form>
</p:outputPanel>
</p:dialog>
<p:dialog widgetVar="popAddTypeUtilisateur" modal="true" header="Add">
<p:ajax event="close"
update=":Type_Utilisateur_Form:Type_Utilisateur_List" />
<p:outputPanel autoUpdate="true">
<h:form>
<p:panelGrid columns="2" layout="grid">
<h:outputLabel value=" User
Type designation :" />
<p:inputText id="designationTypeUtilisateur"
value="#{typeUtilisateurBean.typeUtilisateur.designationTypeUtilisateur}" />
</p:panelGrid>
<p:commandButton value="Save" action="#{typeUtilisateurBean.save}"
oncomplete="if (!args.validationFailed) PF('popAddTypeUtilisateur').hide();" />
<p:commandButton value="Cancel"
action="#{typeUtilisateurBean.init}"
oncomplete="PF('popAddTypeUtilisateur').hide();" />
</h:form>
</p:outputPanel>
</p:dialog>
</ui:insert>
</ui:define>
</ui:composition>
TypeUtilisateurBean:
package tn.com.bj.presentation;
import java.io.Serializable;
import java.util.List;
import javax.annotation.PostConstruct;
import javax.faces.bean.ViewScoped;
import javax.faces.model.ListDataModel;
import org.primefaces.context.RequestContext;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.beans.factory.annotation.Qualifier;
import org.springframework.context.annotation.Scope;
import org.springframework.stereotype.Controller;
import tn.com.bj.entities.TypeUtilisateur;
import tn.com.bj.service.ITypeUtilisateurService;
#Controller("typeUtilisateurBean")
#Scope("session")
#ViewScoped
public class TypeUtilisateurBean implements Serializable {
/**
*
*/
private static final long serialVersionUID = 1L;
#Autowired
#Qualifier("typeutilisateurService")
private ITypeUtilisateurService typeUtilisateurService;
private TypeUtilisateur typeUtilisateur = new TypeUtilisateur();
private ListDataModel listTypeUtilisateur;
private List<TypeUtilisateur> filteredTypeUtilisateur;
#PostConstruct
public void init() {
listTypeUtilisateur = new ListDataModel();
listTypeUtilisateur.setWrappedData(typeUtilisateurService
.findAll(TypeUtilisateur.class));
}
public void create() {
typeUtilisateur = new TypeUtilisateur();
}
public void getRow() {
typeUtilisateur = (TypeUtilisateur) listTypeUtilisateur.getRowData();
}
public void delete() {
getRow();
typeUtilisateurService.deleteService(typeUtilisateur);
listTypeUtilisateur.setWrappedData(typeUtilisateurService
.findAll(TypeUtilisateur.class));
}
public void save() {
typeUtilisateur = typeUtilisateurService
.saveOrUpdateService(typeUtilisateur);
init();
}
public ITypeUtilisateurService getTypeUtilisateurService() {
return typeUtilisateurService;
}
public void setTypeUtilisateurService(
ITypeUtilisateurService typeUtilisateurService) {
this.typeUtilisateurService = typeUtilisateurService;
}
public TypeUtilisateur getTypeUtilisateur() {
return typeUtilisateur;
}
public void setTypeUtilisateur(TypeUtilisateur typeUtilisateur) {
this.typeUtilisateur = typeUtilisateur;
}
public ListDataModel getListTypeUtilisateur() {
return listTypeUtilisateur;
}
public void setListTypeUtilisateur(ListDataModel listTypeUtilisateur) {
this.listTypeUtilisateur = listTypeUtilisateur;
}
public List<TypeUtilisateur> getFilteredTypeUtilisateur() {
return filteredTypeUtilisateur;
}
public void setFilteredTypeUtilisateur(
List<TypeUtilisateur> filteredTypeUtilisateur) {
this.filteredTypeUtilisateur = filteredTypeUtilisateur;
}
}
<ui:composition template="/template.xhtml">
<ui:define name="title">
<h:outputText value="#{bundle.ListDriverTitle}"></h:outputText>
</ui:define>
<ui:define name="body">
<h:form id="driverForm">
<h:panelGrid id="messagePanel" >
<h:messages errorStyle="color: red" infoStyle="color: green" layout="table"/>
</h:panelGrid>
<h:panelGrid >
<p:dataTable value="#{driverController.items}" lazy="true" selectionMode="single" paginator="true" rows="10" paginatorPosition="bottom" var="item" id="itemTable" rowKey="#{item.id}" styleClass="ui-datatable-hor-scroll">
<p:column>
<f:facet name="header">
<h:outputText value="#{bundle.ListDriverTitle_id}"/>
</f:facet>
<h:outputText value="#{item.id}"/>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="#{bundle.ListDriverTitle_surname}"/>
</f:facet>
<h:outputText value="#{item.surname}"/>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="#{bundle.ListDriverTitle_names}"/>
</f:facet>
<h:outputText value="#{item.names}"/>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="#{bundle.ListDriverTitle_idNumber}"/>
</f:facet>
<h:outputText value="#{item.idNumber}"/>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="#{bundle.ListDriverTitle_driverCode}"/>
</f:facet>
<h:outputText value="#{item.driverCode}"/>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="#{bundle.ListDriverTitle_active}"/>
</f:facet>
<h:outputText value="#{item.active}"/>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="#{bundle.ListDriverTitle_type}"/>
</f:facet>
<h:outputText value="#{item.type}"/>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="#{bundle.ListDriverTitle_cellNumber}"/>
</f:facet>
<h:outputText value="#{item.cellNumber}"/>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="#{bundle.ListDriverTitle_createdDate}"/>
</f:facet>
<h:outputText value="#{item.createdDate}">
<f:convertDateTime pattern="MM/dd/yyyy HH:mm:ss" />
</h:outputText>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="#{bundle.ListDriverTitle_whs}"/>
</f:facet>
<h:outputText value="#{item.whs.name}"/>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value=" "/>
</f:facet>
<p:commandButton action="#{driverController.prepareView}" value="#{bundle.ListDriverViewLink}" ajax="false" immediate="false">
<f:setPropertyActionListener target="#{driverController.selectedDriver}" value="#{item}"/>
</p:commandButton>
<h:outputText value=" "/>
<p:commandButton action="#{driverController.prepareEdit}" value="#{bundle.ListDriverEditLink}" ajax="false" immediate="false">
<f:setPropertyActionListener target="#{driverController.selectedDriver}" value="#{item}" />
</p:commandButton>
<h:outputText value=" "/>
<p:commandButton action="#{driverController.destroy}" value="Delete" ajax="false" immediate="false">
<f:setPropertyActionListener target="#{driverController.selectedDriver}" value="#{item}"/>
</p:commandButton>
</p:column>
</p:dataTable>
</h:panelGrid>
<br />
<p:commandButton action="#{driverController.prepareCreate}" value="#{bundle.ListDriverCreateLink}" ajax="false"/>
<p:menuButton value="Download Documents">
<p:menuitem immediate="true" process="#none" ajax="false">
<h:commandLink target="_blank">
<img src="#{resource['images/excel-icon.png']}" style="border: none; width: 15px; height: 15px;"/>
<p:dataExporter type="xls" target="itemTable" fileName="DriversList" pageOnly="true"/>
<span>Current page</span>
</h:commandLink>
</p:menuitem>
<p:menuitem immediate="true" process="#none" ajax="false">
<h:commandLink target="_blank">
<img src="#{resource['images/excel-icon.png']}" style="border: none; width: 15px; height: 15px;"/>
<p:dataExporter type="xls" target="itemTable"fileName="DriversList" p/>
<span>All pages</span>
</h:commandLink>
</p:menuitem>
</p:menuButton>
</h:form>
</ui:define>
</ui:composition>
When I download an excel file, the buttons from the table are also downloaded. What can I do to exclude them.
If you need more explanation please feel free to ask me. I need the best solution. Thank you
You can exclude columns, which should not be exported by using:
<p:column exportable="false">
I had implement editable p:datatable. After I click on the edit button and change the value, the Edit and Cancel button is not working, and the row just keep open to edit. May I know any mistake I am facing?
The code is
<p:panel>
<p:messages id="tableMessages" autoUpdate="true" closable="true" />
<p:dataTable value="#{bean.dataList}" var="data"
id="table" editable="true">
<p:ajax event="rowEdit" listener="#{bean.onRowEdit}"/>
<p:ajax event="rowEditCancel" listener="#{bean.onRowCancel}"/>
<p:column>
<f:facet name="header">
<h:outputLabel value="ID" />
</f:facet>
<h:outputText value="#{data.id}" />
</p:column>
<p:column>
<f:facet name="header">
<h:outputLabel value="Name" />
</f:facet>
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{data.name}" />
</f:facet>
<f:facet name="input">
<p:inputText id="editName" value="#{data.name}">
<f:validateLength minimum="3" maximum="30" />
</p:inputText>
</f:facet>
</p:cellEditor>
</p:column>
<p:column>
<f:facet name="header">
<h:outputLabel value="Gender" />
</f:facet>
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{data.gender}" />
</f:facet>
<f:facet name="input">
<p:inputText id="editGender" value="#{data.gender}">
<f:validateLength minimum="3" maximum="30" />
</p:inputText>
</f:facet>
</p:cellEditor>
</p:column>
<p:column>
<f:facet name="header">
<h:outputLabel value="Edit" />
</f:facet>
<p:rowEditor />
</p:column>
</p:dataTable>
</p:panel>
I'm following the example given at http://www.primefaces.org/showcase/ui/datatableRowSelectionSingle.jsf
I'm using this as a portlet in Liferay. Here is my code:
The HTML:
<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">
<h:panelGrid columns="1" cellpadding="10" width="100%">
<p:dataTable id="campaignTable" var="data"
value="#{campaign.allCampaigns}" selectionMode="single"
rowKey="#{data.campaignId}" selection="#{campaign.selectedCampaign}">
<f:facet name="header">
<p:commandButton type="button" value="Create Campaign" icon="ui-icon-document" update=":form:createForm" onclick="createDialog.show()" />
</f:facet>
<p:column sortBy="#{data.campaignId}">
<f:facet name="header">ID</f:facet>
<h:outputText value="#{data.campaignId}" />
</p:column>
<p:column sortBy="#{data.carrier}">
<f:facet name="header">Carrier</f:facet>
<h:outputText value="#{data.carrier}" />
</p:column>
<p:column sortBy="#{data.shortCode}">
<f:facet name="header">Short Code</f:facet>
<h:outputText value="#{data.shortCode}" />
</p:column>
<p:column sortBy="#{data.sendType}">
<f:facet name="header">Send Type</f:facet>
<h:outputText value="#{data.sendType}" />
</p:column>
<p:column sortBy="#{data.startDate}">
<f:facet name="header">Start Date</f:facet>
<h:outputText value="#{data.startDate.time}">
<f:convertDateTime pattern="MM/dd/yyyy hh:mm a" />
</h:outputText>
</p:column>
<p:column sortBy="#{data.endDate}">
<f:facet name="header">End Date</f:facet>
<h:outputText value="#{data.endDate.time}">
<f:convertDateTime pattern="MM/dd/yyyy hh:mm a" />
</h:outputText>
</p:column>
<p:column sortBy="#{data.messageText}">
<f:facet name="header">Text Message</f:facet>
<h:outputText value="#{data.messageText}" />
</p:column>
<p:column sortBy="#{data.serviceId}">
<f:facet name="header">Service ID</f:facet>
<h:outputText value="#{data.serviceId}" />
</p:column>
<p:column sortBy="#{data.responseKeyword}">
<f:facet name="header">Response Keyword</f:facet>
<h:outputText value="#{data.responseKeyword}" />
</p:column>
</p:dataTable>
</h:panelGrid>
<p:dialog id="createDialog" header="Create Campaign" widgetVar="createDialog">
<h:panelGrid id="createForm" columns="2" cellpadding="5">
<h:outputLabel for="campaignId" value="Campaign ID:" />
<p:inputText value="#{campaign.selectedCampaign.campaignId}" id="campaignId" required="true" label="Campaign ID" />
<h:outputLabel for="startDate" value="Start Date:" />
<p:inputText value="#{campaign.selectedCampaign.startDate}" id="startDate" required="true" label="Start Date" />
<f:facet name="footer">
<p:commandButton id="createCampaignButton" value="Create" update=":growl" actionListener="#{campaign.createCampaign()}" />
</f:facet>
</h:panelGrid>
</p:dialog>
</h:form>
</ui:composition>
And the backing bean:
#ManagedBean
#ViewScoped
public class Campaign implements Serializable {
private List<CampaignBean> allCampaigns;
private CampaignBean selectedCampaign;
public Campaign() {
MyProxy proxy = new MyProxy();
try {
CampaignsResponse response = proxy.getAllCampaigns();
if (response != null) {
setAllCampaigns(new ArrayList<CampaignBean>(Arrays
.asList(response.getCampaigns())));
}
} catch (RemoteException e) {
FacesContext context = FacesContext.getCurrentInstance();
context.addMessage(null, new FacesMessage("Error",
"Problem listing campaigns"));
}
}
public void createCampaign() {
}
/* Getters and Setters */
public List<CampaignBean> getAllCampaigns() {
return allCampaigns;
}
public void setAllCampaigns(List<CampaignBean> allCampaigns) {
this.allCampaigns = allCampaigns;
}
public CampaignBean getSelectedCampaign() {
return selectedCampaign;
}
public void setSelectedCampaign(CampaignBean selectedCampaign) {
this.selectedCampaign = selectedCampaign;
}
}
The form is not populated with the selected row values!
I finally figured out what the problem was. The entire table was inside a "TabView" component. I was using the wrong selector i.e. instead of using update=":form:createForm" I should have used update=":tabView:form:createForm" and remove the type="button" declaration.