I am trying to show tooltip dynamically after mouseon event in JSF. Also I need to call a java method on mouseon event in datatable row.
Here what I have tried:
<p:ajax event="mouseover" actionListener="#{buyerWalletView.testMethod)}"/>
public void testMethod(ActionEvent ev) throws IOException {
if (ev.getSource() != null && ev.getSource() instanceof HtmlDataTable) {
HtmlDataTable objHtmlDataTable = (HtmlDataTable) ev.getSource();
System.out.println(objHtmlDataTable.getRowIndex());
}
}
// for tooltip:
<p:column width="150">
<f:facet name="header">
<h:outputText value="#{lbl['wallet.platform']}" />
</f:facet>
<h:outputText value="#{cartItem.platformType}"/>
<p:tooltip for="walletHistoryTable"
value="test"/>
</p:column>
Thanks in advance.
Related
I am displaying list of some objects in primefaces datatable. Apart from object related columns, I have added two columns that contain commandbutton. Each of these commandbutton make ajax calls to desired methods in bean. I want to disable both commandbuttons in that row when any of the button is clicked and enable them again once action is completed successfully. The method execution is simulated by ajaxStatus which is working fine.
Following is selected code of xhtml
<h:form id="form1" >
<p:remoteCommand name="onload" action="#{controlBean.init}" autoRun="true" />
<h:outputtext>Sample Project</h:outputtext>
<p:ajaxStatus style="display:block;margin-bottom:2em;height:24px;">
<f:facet name="prestart">
<h:outputText value="Starting..." /> </f:facet>
<f:facet name="error"> <h:outputText value="Error" />
</f:facet>
<f:facet name="success"> <h:outputText value="Success" />
</f:facet>
<f:facet name="default"> <h:outputText value="Idle" />
</f:facet>
<f:facet name="start"> <h:outputText value="Please Wait" />
<p:graphicImage name="/images/ajaxloadingbar.gif" />
</f:facet>
</p:ajaxStatus>
<p:dataTable var="appl" id="tbl1" rowIndexVar="rowIndx" value="#{controlBean.applsList}">
<p:column headerText="Name">
<h:outputText value="#{appl.applName}" />
</p:column>
<p:column headerText="Type">
<h:outputText value="#{appl.applType}" />
</p:column>
<p:column headerText="Desc" rendered="true">
<h:outputText value="#{appl.applDesc}" />
</p:column>
<p:column headerText="Start Appl" id="col4">
<p:commandButton value="Submit" ajax="true"
process="#this"
widgetVar="startButtonVar"
id="startBtn" update="msgs, col4, startBtn"
action="#{controlBean.startAction}" style="margin-right:20px;"
styleClass="ui-priority-primary"
disabled="#{controlBean.startBtnDisabled}">
<f:setPropertyActionListener value="#{appl}" target="#{controlBean.selectedAppl}"/>
</p:commandButton>
</p:column>
<p:column headerText="Stop Appl" id="col5">
<p:commandButton value="Submit" ajax="true"
process="#this"
widgetVar="stopButtonVar"
id="stopBtn" update="msgs, col5"
action="#{controlBean.stopAction}" style="margin-right:20px;"
styleClass="ui-priority-primary"
disabled="#{controlBean.btnDisabled}">
<f:setPropertyActionListener value="#{appl}" target="#{controlBean.selectedAppl}"/>
</p:commandButton>
</p:column>
</p:dataTable>
</h:form>
backing bean methods are as under:
public void startAction()
{
System.out.println("In start action method");
this.btnDisabled = true;
for(int i=0;i<100000;i++)
{
if(i%10000 == 0)
{
System.out.println(i);
}
for(int j=0;j<10000;j++)
{
for(int k=0;k<1000;k++)
{
}
}
}
MessageUtils.info(getSelectedAppl().getApplName()+" has been started");
this.btnDisabled = false;
}
public void stopAction()
{
System.out.println("In stop action method");
this.btnDisabled = true;
for(int i=0;i<100000;i++)
{
if(i%10000 == 0)
{
System.out.println(i);
}
for(int j=0;j<10000;j++)
{
for(int k=0;k<1000;k++)
{
}
}
}
MessageUtils.info(getSelectedAppl().getApplName()+" has been stopped");
this.btnDisabled = false;
}
Everything is working fine except disabling/enabling of commandbuttons. Any help in this regard will be highly appreciated.
Regards
You could disable them on the onclick javascript handler:
<p:commandButton id="startBtn"
widgetVar="startButtonVar"
onclick="PF('startButtonVar').disable();"
.....
The onclick will be executed BEFORE the AJAX call. On return, as the button is updated, it will be reenabled.
I'm working on a theme for an app I'm making with PrimeFaces 6.2 (community edition) and I'd like to get my simulated DAO objects working before I proceed with my css templating.
I've got an issue I came across in the past and I can't find the right answer for it again. Would someone point out an error I've made somewhere in my code?
Details:
I've made a somewhat complex DataTable using PrimeFaces LazyDataModel with little help from PrimeFaces Showcase pages. My main issue is, when I write something in the filter fields or click on any column headers to do data sorting or even click on pagination buttons I get an unexpexted data rendering issue.
Filtered, sorted and paginated results get displayed in a single concatenated row what I don't want. I've posted images and code further below for insight.
Also, I'd like to point out:
No exceptions in JS console.
No exceptions in Java console.
don't mind the missing pagination icons (text-indent: 0;)
XHTML:
<h:form id="input-form-dt2">
<H4>DATA TABLE - LAZY MODEL</H4>
<div class="flex-container">
<p:outputPanel id="dev-input-panel-13">
<p:dataTable var="DOTable" value="#{dtModelLazy.DOTList}" paginator="true" rows="10" rowKey="#{DOTable.userID}"
paginatorTemplate="{RowsPerPageDropdown} {FirstPageLink} {PreviousPageLink} {CurrentPageReport} {NextPageLink} {LastPageLink}"
rowsPerPageTemplate="5,10,15,25,50" selectionMode="single" selection="#{dtModelLazy.selectedObj}" id="DTModelB" lazy="true">
<p:ajax event="rowSelect" listener="#{dtModelLazy.onRowSelect}" update="input-form-dt2:dlgDTOObjDetail" oncomplete="PF('DTObjDialog').show()" />
<p:column headerText="User ID" sortBy="#{DOTable.userID}" filterBy="#{DOTable.userID}" filterMatchMode="contains">
<h:outputText value="#{DOTable.userID}" />
</p:column>
<p:column headerText="Name" sortBy="#{DOTable.name}" filterBy="#{DOTable.name}" filterMatchMode="contains">
<h:outputText value="#{DOTable.name}" />
</p:column>
<p:column headerText="Surname" sortBy="#{DOTable.surname}" filterBy="#{DOTable.surname}" filterMatchMode="contains">
<h:outputText value="#{DOTable.surname}" />
</p:column>
<p:column headerText="Age" sortBy="#{DOTable.age}" filterBy="#{DOTable.age}" filterMatchMode="contains">
<h:outputText value="#{DOTable.age}" />
</p:column>
<p:column headerText="Address" sortBy="#{DOTable.address}" filterBy="#{DOTable.address}" filterMatchMode="contains">
<h:outputText value="#{DOTable.address}" />
</p:column>
<p:column headerText="City" sortBy="#{DOTable.city}" filterBy="#{DOTable.city}" filterMatchMode="contains">
<h:outputText value="#{DOTable.city}" />
</p:column>
<p:column headerText="Post code" sortBy="#{DOTable.postCode}" filterBy="#{DOTable.postCode}" filterMatchMode="contains">
<h:outputText value="#{DOTable.postCode}" />
</p:column>
<p:column headerText="Country code" sortBy="#{DOTable.countryCode}" filterBy="#{DOTable.countryCode}" filterMatchMode="contains">
<h:outputText value="#{DOTable.countryCode}" />
</p:column>
<p:column headerText="Phone number" sortBy="#{DOTable.phoneNumber}" filterBy="#{DOTable.phoneNumber}" filterMatchMode="contains">
<h:outputText value="#{DOTable.phoneNumber}" />
</p:column>
<p:column headerText="Avatar hash" sortBy="#{DOTable.photoID}" filterBy="#{DOTable.photoID}" filterMatchMode="contains">
<h:outputText value="#{DOTable.photoID}" />
</p:column>
</p:dataTable>
<p:dialog id="dlgDTOObjDetail" header="DataTable Object Detail" widgetVar="DTObjDialog" modal="true" showEffect="fade" hideEffect="fade" resizable="false">
<p:outputPanel id="DTObjDetail">
<p:panelGrid columns="2" rendered="#{not empty dtModelLazy.selectedObj}" columnClasses="label,value">
<h:outputText value="User ID: " />
<h:outputText value="#{dtModelLazy.selectedObj.userID}" />
<h:outputText value="Name: " />
<h:outputText value="#{dtModelLazy.selectedObj.name}" />
<h:outputText value="Surname: " />
<h:outputText value="#{dtModelLazy.selectedObj.surname}" />
<h:outputText value="Age: " />
<h:outputText value="#{dtModelLazy.selectedObj.age}" />
<h:outputText value="Address: " />
<h:outputText value="#{dtModelLazy.selectedObj.address}" />
<h:outputText value="City: " />
<h:outputText value="#{dtModelLazy.selectedObj.city}" />
<h:outputText value="Post code: " />
<h:outputText value="#{dtModelLazy.selectedObj.postCode}" />
<h:outputText value="Country code: " />
<h:outputText value="#{dtModelLazy.selectedObj.countryCode}" />
<h:outputText value="Phone number: " />
<h:outputText value="#{dtModelLazy.selectedObj.phoneNumber}" />
<h:outputText value="Photo hash: " />
<h:outputText value="#{dtModelLazy.selectedObj.photoID}" />
</p:panelGrid>
</p:outputPanel>
</p:dialog>
</p:outputPanel>
</div>
<hr></hr>
</h:form>
LAZY MODEL:
public class DataTableModelLazy extends LazyDataModel<DODataTable> {
private static final long serialVersionUID = -2647349397077805782L;
private List<DODataTable> datasource;
public DataTableModelLazy(List<DODataTable> datasource) {
this.datasource = datasource;
}
#Override
public DODataTable getRowData(String rowKey) {
for(DODataTable dtObj : datasource) {
if(dtObj.getUserID().equals(rowKey))
return dtObj;
}
return null;
}
#Override
public Object getRowKey(DODataTable dtObj) {
return dtObj.getUserID();
}
#Override
public List<DODataTable> load(int first, int pageSize, String sortField, SortOrder sortOrder, Map<String,Object> filters) {
List<DODataTable> data = new ArrayList<DODataTable>();
//filter
for(DODataTable dtObj : datasource) {
boolean match = true;
if(filters != null) {
for (Iterator<String> it = filters.keySet().iterator(); it.hasNext();) {
try {
String filterProperty = it.next();
Object filterValue = filters.get(filterProperty);
Field field = dtObj.getClass().getDeclaredField(filterProperty);
field.setAccessible(true);
String fieldValue = String.valueOf(field.get(dtObj));
field.setAccessible(false);
if(filterValue == null || fieldValue.startsWith(filterValue.toString())) {
match = true;
} else {
match = false;
break;
}
} catch(Exception e) {
match = false;
}
}
}
if(match) {
data.add(dtObj);
}
}
//sort
if(sortField != null) {
Collections.sort(data, new DataTableModelLazySorter(sortField, sortOrder));
}
//rowCount
int dataSize = data.size();
this.setRowCount(dataSize);
//paginate
if(dataSize > pageSize) {
try {
return data.subList(first, first + pageSize);
} catch(IndexOutOfBoundsException e) {
return data.subList(first, first + (dataSize % pageSize));
}
} else {
return data;
}
}
}
VIEW BEAN:
#Named("dtModelLazy")
#ViewScoped
public class DataGeneratorBeanLazy implements Serializable {
private static final long serialVersionUID = -5918527333909822277L;
private LazyDataModel<DODataTable> DOTList;
private DODataTable selectedObj;
#Inject
private DataGeneratorBean dataGen;
#PostConstruct
public void init() {
DOTList = new DataTableModelLazy(dataGen.createDTObjects(1500));
}
public LazyDataModel<DODataTable> getDOTList() {
return DOTList;
}
public void setDOTList(LazyDataModel<DODataTable> dOTList) {
DOTList = dOTList;
}
public void onRowSelect(SelectEvent event) {
FacesMessage msg = new FacesMessage("DataTable object selected!", ((DODataTable) event.getObject()).getUserID());
FacesContext.getCurrentInstance().addMessage(null, msg);
}
public DODataTable getSelectedObj() {
return selectedObj;
}
public void setSelectedObj(DODataTable selectedObj) {
this.selectedObj = selectedObj;
}
}
Update 1
I have modified the update property as update="input-form-dt2:dlgDTOObjDetail"to meet the suggestion provided. Also, I added the id property for the dialog. The issue still remains.
Update 2
I've changed my approach and started with the basic DataTable first. Also, I've stripped the .xhtml to a bare minimum. It contains only a form with the DataTable inside like so:
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://xmlns.jcp.org/jsf/core"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:p="http://primefaces.org/ui">
<div>
UI components design
</div>
<h:form id="input-form-dt1">
<h4>DATA TABLE - BASIC</h4>
<p:dataTable id="DTableA" var="dataObject" value="#{dataTableBean.objectList}" paginator="true" rows="10" rowKey="#{dataObject.id}"
paginatorTemplate="{RowsPerPageDropdown} {FirstPageLink} {PreviousPageLink} {CurrentPageReport} {NextPageLink} {LastPageLink}"
rowsPerPageTemplate="5,10,15,25,50">
<p:column headerText="User ID" sortBy="#{dataObject.userID}" filterBy="#{dataObject.userID}" filterMatchMode="contains">
<h:outputText value="#{dataObject.userID}" />
</p:column>
<p:column headerText="Name" sortBy="#{dataObject.name}" filterBy="#{dataObject.name}" filterMatchMode="contains" >
<h:outputText value="#{dataObject.name}" />
</p:column>
<p:column headerText="Surname" sortBy="#{dataObject.surname}" filterBy="#{dataObject.surname}" filterMatchMode="contains" >
<h:outputText value="#{dataObject.surname}" />
</p:column>
<p:column headerText="Age" sortBy="#{dataObject.age}" filterBy="#{dataObject.age}" filterMatchMode="contains" >
<h:outputText value="#{dataObject.age}" />
</p:column>
<p:column headerText="Address" sortBy="#{dataObject.address}" filterBy="#{dataObject.address}" filterMatchMode="contains" >
<h:outputText value="#{dataObject.address}" />
</p:column>
<p:column headerText="City" sortBy="#{dataObject.city}" filterBy="#{dataObject.city}" filterMatchMode="contains" >
<h:outputText value="#{dataObject.city}" />
</p:column>
<p:column headerText="Post code" sortBy="#{dataObject.postCode}" filterBy="#{dataObject.postCode}" filterMatchMode="contains" >
<h:outputText value="#{DOTable.postCode}" />
</p:column>
<p:column headerText="Country code" sortBy="#{dataObject.countryCode}" filterBy="#{dataObject.countryCode}" filterMatchMode="contains" >
<h:outputText value="#{dataObject.countryCode}" />
</p:column>
<p:column headerText="Phone number" sortBy="#{dataObject.phoneNumber}" filterBy="#{dataObject.phoneNumber}" filterMatchMode="contains" >
<h:outputText value="#{dataObject.phoneNumber}" />
</p:column>
<p:column headerText="Avatar hash" sortBy="#{dataObject.photoID}" filterBy="#{dataObject.photoID}" filterMatchMode="contains">
<h:outputText value="#{dataObject.photoID}" />
</p:column>
</p:dataTable>
</h:form>
</ui:composition>
As you can see I've also removed all event listeners. I've added a new field to my data object (id of type Integer) and bound DataTables rowKey to it (previously bound to userID of type String - not a good idea). My DataTable backing bean is now as basic as it can be:
#Named("dataTableBean")
#ViewScoped
public class DataTableBean implements Serializable {
private static final long serialVersionUID = -1662465661106141910L;
private List<DTObject> objectList;
#Inject
private DataGeneratorBean dataGen;
#PostConstruct
public void init() {
setObjectList(dataGen.createDTObjects(1500));
}
public List<DTObject> getObjectList() {
if (objectList == null) {
return new ArrayList<>();
} else {
return objectList;
}
}
public void setObjectList(List<DTObject> objectList) {
this.objectList = objectList;
}
}
Now, there are no custom filters, sorters or paginators of any type, not even a data model, just raw data objects in a simple list. The output result is exactly the same as before when paginator buttons are clicked or data gets filtered. All resulting data still gets displayed in a single concatenated line.
ANSWER:
As Kukeltje pointed out in the comments I've made a complete nonsense in my main container and added an autoupdate component to it. That component messed up my data table events, loading data without a table to hold it. Once I've removed the component from my main container, everything worked out. Here is the code for my main container (commented out the troublemaker).
<div id="content-window">
<p:outputPanel id="content-panel">
<ui:include src="#{contentLoaderBean.mainContent}" />
<!-- <p:autoUpdate /> -->
</p:outputPanel>
</div>
The only situations I've seen this happening is when the datatable is fully updated in addtion to a partial update of the datatable via an event (page or filter or sort or...) In the rowSelect you do seem to update the full form which contains the datatable as well. That is bad practice and can as mentioned result in what you seem so remove that.
But...in your question there are no filter ajax events that explicitly update the full datatable so that cannot cause it. Yet with 99% vertainty there is something fully updates the datatable. Three options
there is something in your live code you left out of the datatable in your question
There is something else outside the code you posted that plays havoc (an autoupdate e.g),
an update from the server side is being done in a method
I am trying to perform a row edit in primefaces databable. My problem is when I key in new value in inputText in CellEditor
and click edit (primefaces icon) onCellEdit method is calledsuccessfully but does not pick the newly value in the inputText it pick value that was initially in the datatable. What Am I doing wrong? I am using primefaces 3.5
Here in jsf code
<h:form id="form1">
<p:growl id="messages" showDetail="true"/>
<p:panel header="Registered Devices" style="min-height: 400px;" id="paneldevices">
<p:dataTable emptyMessage="No Device Registered" editable="true" widgetVar="deviceTable" id="idGrid" value="#{deviceMgdBean.devices}" var="item" >
<p:ajax event="rowEdit" listener="#{deviceMgdBean.onCellEdit()}" update=":form1:messages"/>
<p:ajax event="rowEditCancel" listener="#{deviceMgdBean.onCancel}" update=":form1:messages" />
<p:column headerText="Options" style="width:50px">
<p:rowEditor />
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="Device_name"/>
</f:facet>
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{item.device_name}"/>
</f:facet>
<f:facet name="input">
<p:inputText value="#{item.device_name}" style="width:80%" />
</f:facet>
</p:cellEditor>
</p:column>
</h:form>
Here is my managed Bean
#ManagedBean
#ViewScoped
public class DeviceMgdBean implements Serializable {
public List<Devices> getDevices()
{
List<Devices> l=getDevdao().getDevices();//devices fetched from database
return l;
}
public void onCellEdit(RowEditEvent event)
{
Devices devo=(Devices) event.getObject();
FacesMessage msg = new FacesMessage("Device Edit","Test:"+devo.getDeviceName());
FacesContext.getCurrentInstance().addMessage(null, msg);
}
public void onCancel(RowEditEvent event)
{
FacesMessage msg = new FacesMessage("Item Cancelled");
FacesContext.getCurrentInstance().addMessage(null, msg);
Devices devo=(Devices) event.getObject();
}
}
class Devices {
private int device_id;
private String device_name;
//getter and setters
}
private List<Devices> l;
public List<Devices> getDevices() {
if(l==null) l=getDevdao().getDevices();//devices fetched from database
return l;
}
I'm working with JSF and primefaces. I want to update a row when I click on the button (pencil). I used the first code from this tutorial (Primefaces docs), but dosent work in my case.
the problem is : when i click the button (pencil) to update a row, nothing change. i have always the old values
This is my JSF code :
<f:view>
<h:form id="form">
<p:growl id="msgs" showDetail="true"/>
<p:dataTable id="tservice" var="item" value="#{serviceMBean.services}" editable="true" style="margin-bottom:20px">
<f:facet name="header"> edit </f:facet>
<p:ajax event="rowEdit" listener="#{serviceMBean.onRowEdit}" update=":form:msgs" />
<p:ajax event="rowEditCancel" listener="#{serviceMBean.onRowCancel}" update=":form:msgs" />
<p:column headerText="Libelle du service">
<p:cellEditor>
<f:facet name="output"><h:outputText value="#{item.libelleservice}" /></f:facet>
<f:facet name="input">
<p:inputText value="#{item.libelleservice}" style="width:100%" label="Libelle"/>
</f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="Utilisateurs/Service">
<p:cellEditor>
<f:facet name="output"><h:outputText value="#{item.nbruserservice}" /></f:facet>
<f:facet name="input">
<p:inputText value="#{item.nbruserservice}" style="width:100%" label="Nbre Users"/>
</f:facet>
</p:cellEditor>
</p:column>
<p:column style="width:32px">
<p:rowEditor />
</p:column>
And this is my managed bean code:
#Named(value = "serviceMBean")
#ViewScoped
public class ServiceMBean implements Serializable {
private List<Service> serviceList;
private Service s;
#EJB
private ServiceManager serviceManager;
public ServiceMBean() {}
public void modifierService(Service s1) {
this.serviceManager.updateService(s1);
}
public void onRowEdit(RowEditEvent event) {
Service s2 = (Service) event.getObject();
System.out.println("--->" + s2.getNbruserservice());
FacesMessage msg = new FacesMessage("Service Modifié", ((Service) event.getObject()).getLibelleservice());
this.modifierService(s2);
FacesContext.getCurrentInstance().addMessage(null, msg);
}
public void onRowCancel(RowEditEvent event) {
FacesMessage msg = new FacesMessage("Modification annulée", ((Service) event.getObject()).getLibelleservice());
FacesContext.getCurrentInstance().addMessage(null, msg);
}
}
And this is my code for ServiceManager:
public void updateService(Object service) {
em.merge(service);
}
I think the setter in my JSF page doesn't work. Any solutions or suggestions?
Solution : Add a void method with #PostConstruct.
Example : #PostConstruct
#PostConstruct
public void initialiser() {
serviceList = this.getServices();
}
Don't forget the getter and setter of serviceList
In the JSF page, the value of datatable will be : value="#{ServiceMBean.serviceList}"
I have a data table with on-cell editing feature, and I want to update the data table to show the modified record by apply them a different style class.
Here are my problems:
If i do not update the data table when the onCellEdit event fires, records are correctly updated, but I cannot see the applyed style class for modified rows.
If I update the data table when the onCellEdit event fires and use the return key to update a value, all works fine, and I can see the applied style class for modified rows.
If I update the data table when the on-cell edit event fires and use the mouse clic to update a value (clicking on another row or on another cell within the same row), only the first value is updated correctly; when trying to update other values, the onCellEdit event triggers before I can insert the new value, so the event triggers with newValue=oldValue, for all the subsequent changes.
The xhtml page:
<h:form id="frm_tbl_riv">
<p:dataTable id="tbl_rilevazioni" var="rilevazione"
value="#{rilevazioni.rilevazioni}" widgetVar="tbl_rilevazioni_id"
editable="true" editMode="cell" scrollable="true" scrollHeight="350"
rowKey="#{rilevazione.idRilevazione}" selectionMode="single"
selection="#{rilevazioni.selezionata}">
<p:ajax event="rowSelect"
update=":tView:frm_tbl_riv:popup_rilevazioni" />
<p:ajax event="cellEdit" listener="#{rilevazioni.onCellEdit}"
update=":tView:frm_btn_riv" />
<!-- update=":frm_btn_riv :frm_tbl_riv" -->
<p:ajax event="contextMenu"
listener="#{rilevazioni.onRilevazioneSelezionata}"
update="#this" />
<p:column headerText="#{msg['rilevazione']}" width="130">
<f:facet name="header">
<h:outputText value="#{msg['rilevazione']}" />
</f:facet>
<h:outputText value="#{rilevazione.descRilevazione}" id="descRil" />
</p:column>
<p:column headerText="#{msg['valore']}"
styleClass="#{rilevazioni.isModificata(rilevazione) ? 'modificata' : ''}"
width="30">
<h:outputText value="#{rilevazione.valore}"
rendered="#{!rilevazioni.isModificabile(rilevazione)}" />
<p:cellEditor
rendered="#{rilevazioni.isModificabile(rilevazione)}">
<f:facet name="output">
<h:outputText value="#{rilevazione.valore}" />
</f:facet>
<f:facet name="input">
<p:inputText value="#{rilevazione.valore}"
label="#{msg['valore']}">
</f:facet>
</p:cellEditor>
</p:column>
</p:dataTable>
</h:form>
And the managed bean (view scoped):
#ManagedBean(name = "rilevazioni")
#ViewScoped
public class GestioneRilevazioniBean implements Serializable
{
// ...
public void onCellEdit(CellEditEvent event)
{
FacesContext context = FacesContext.getCurrentInstance();
FacesMessage msg = null;
Object nuovoValore = event.getNewValue();
Object vecchioValore = event.getOldValue();
int i = event.getRowIndex();
RilevazioneGiornaliera r = rilevazioni.get(i);
r.setIdUtente(userBean.getUserId());
if (!nuovoValore.equals(vecchioValore))
{
try
{
RilevazioniService.getInstance().updateRilevazioneGiornaliera(r);
modificate.add(r);
} catch (Throwable ex)
{
// ...
}
}
}
public boolean isModificata(RilevazioneGiornaliera riv)
{
return modificate.contains(riv);
}
public boolean isModificabile(RilevazioneGiornaliera rilevazione)
{
// some logic
return true;
}
}
If I use:
update=":frm_btn_riv :frm_tbl_riv"
for the on-cell edit event, I obtain the behaviour specified on point 2 and 3. The same with #form or #parent.
I have founded a solution to update the style class to the modified cell after the onCellEdit event fires.
Data table:
<p:ajax event="cellEdit" listener="#{rilevazioni.onCellEdit}"
oncomplete="handleRilevazioniCellEdit(xhr, status, args);" />
// ...
// within the cell editor
<p:inputText id="rilevazioniCellEditInputtext" value="#{rilevazione.valore}"
label="#{msg['valore']}" />
Javascript:
<script>
function handleRilevazioniCellEdit(xhr, status, args)
{
var modelInput = $('#parentId:' + args.rowIndex + '\\:rilevazioniCellEditInputtext');
var cell = modelInput.parent().parent().parent();
cell.addClass('modificata');
}
</script>
Managed bean, at the end of the onCellEdit() event:
RequestContext requestContext = RequestContext.getCurrentInstance();
requestContext.addCallbackParam("rowIndex", event.getRowIndex());