Primefaces Celleditor event doesn't contain new value - jsf

I want to use the PF 4 celleditor and sticked to the example in the showcase. But I get the following behavior:
I can edit my cell, the onCellEdit() inside the bean is called, but the event will contain the old value for event.getNewValue(). Listening to the network traffic, I was able to catch this:
javax.faces.partial.ajax=true&
javax.faces.source=pvChangeForm%3Apvc&
javax.faces.partial.execute=pvChangeForm%3Apvc&
javax.faces.partial.render=pvChangeForm%3Apvc+pvForm&
javax.faces.behavior.event=cellEdit&
javax.faces.partial.event=cellEdit&
pvChangeForm%3Apvc_encodeFeature=true&
pvChangeForm%3Apvc_cellInfo=0%2C1&
pvChangeForm%3Apvc%3A0%3Aj_idt127=pvChangeForm%3Apvc%3A0%3Aj_idt127&
pvChangeForm=pvChangeForm&pvChangeForm%3Apvc%3A0%3Aj_idt130=666&
javax.faces.ViewState=-8810553618561534598%3A1979735468348742605
where the important line is the second to last. 666 is the value I put into the cell. It is also displayed if I edit this cell again. But leaving the cell or pressing Enter, it is not saved.
My datatable:
<h:form id="pvChangeForm">
<p:dataTable id="pvc" var="tVar" value="#{paramBean.pvForChange.values}" editable="true" editMode="cell">
<p:ajax event="cellEdit" listener="#{paramBean.onCellEdit}" update=":pvChangeForm:pvc" />
<p:column>
<p:cellEditor>
<f:facet name="output"><h:outputText value="#{tVar}" /></f:facet>
<f:facet name="input"><p:inputText value="#{tVar}" style="width:96%" label="Wert"/></f:facet>
</p:cellEditor>
</p:column>
</p:dataTable>
</h:form>
paramBean.pvForChange.values is a List<String>. Somehow I have the feeling that the problem lies within this fact (because I want to edit a String in a list directly). But from my understanding, there shouldn't be a problem with that.

Yes, the issue is trying to update a value not wrapped in a POJO. Primefaces datatable are meant to work with the properties wrapped in POJOs, but that said, you can fix your issue using your bean as a wrapping object, like this
<h:form id="pvChangeForm">
<p:dataTable id="pvc" var="tVar" value="#{paramBean.pvForChange.values}" rowIndexVar="index" editable="true" editMode="cell">
<p:ajax event="cellEdit" listener="#{paramBean.onCellEdit}" update=":pvChangeForm:pvc" />
<p:column>
<p:cellEditor>
<f:facet name="output"><h:outputText value="#{paramBean.pvForChange.values[index]}" /></f:facet>
<f:facet name="input"><p:inputText value="#{paramBean.pvForChange.values[index]}" style="width:96%" label="Wert"/></f:facet>
</p:cellEditor>
</p:column>
</p:dataTable>
</h:form>

Related

JSF PrimeFaces dataTable changing value

I have the following code:
<p:dataTable style="background-color:white;color: white;" var="url" value="#{data.data.requirementsDocuments}" editable="true" id="urlTable" editMode="cell">
<p:ajax event="cellEdit" update="urlTable" immediate="true" process="#this"/>
<p:column>
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{url}" />
</f:facet>
<f:facet name="input">
<p:inputText id="modelInput" value="#{url}" style="width:96%" />
</f:facet>
</p:cellEditor>
</p:column>
</p:dataTable>
The problem is that each time I wrote a new value inside the cell it is not updating it. Lets say I have a cell with text "Hello" when I edit it to lets say "World" and press enter, it is not updating the value. requirementsDocuments is List with strings.

Can't edit value in datatable using OnRowEdit in PrimeFaces

I've followed PrimeFaces showcases to use row editing datatable but i can't see why it's not updating data.
here's my datatable:
<p:dataTable id="tab" var="art" value="#{myMB.allArticles}" editable="true" style="margin-bottom:20px">
<f:facet name="header">
</f:facet>
<p:ajax event="rowEdit" listener="#{myMB.onRowEdit}" update=":form:msgs" />
<p:ajax event="rowEditCancel" listener="#{myMB.onRowCancel}" update=":form:msgs" />
<p:column headerText="Name ">
<p:cellEditor>
<f:facet name="output"><h:outputText value="#{art.name}" /></f:facet>
<f:facet name="input"><p:inputText id="modelInput" value="#{art.name}" style="width:100%"/></f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="Budget">
<p:cellEditor>
<f:facet name="output"><h:outputText value="#{art.budget}" /></f:facet>
<f:facet name="input"><p:inputText value="#{art.budget}" style="width:100%" label="Budget"/></f:facet>
</p:cellEditor>
</p:column>
<p:column style="width:32px">
<p:rowEditor />
</p:column>
</p:dataTable>
and in the bean:
public void onRowEdit(RowEditEvent event ) {
Article f = (Article) event.getObject();
formationFacade.update(f);
FacesMessage msg = new FacesMessage("Article Edited", ((Article) event.getObject()).getName());
FacesContext.getCurrentInstance().addMessage(null, msg);
}
I ve seen this : link but it doesn't work for me I get the old value after editing and I have no change in may database .. can someone help me please?
There's one thing that is strange/wrong, that may or may not be the cause of your issues, but I would recommend fixing. From this update=":form:msgs" I assume that you have an enclosing tags like <h:form id="form"><p:growl id="msgs". On the other hand you repeat the id="form" inside <p:dataTable id="form". Repeating the id is surely wrong, but I'm not sure if its the cause of your issue
first, you have to provide the EditMode parameter with the value of
CellEdit
or RowEdit as your case.
second, you can do edit like this without event if you want a simple way to edit data table is
modifyYourModel(Model x){
// call your function to modify
}
and in the data table, you can do that
<p:dataTable id="tab" var="art" value="#{myMB.allArticles}" editable="true" EditMode="rowEdit" style="margin-bottom:20px">
<f:facet name="header">
</f:facet>
<p:ajax event="rowEdit" listener="#{myMB.modifyYourModel(art)}" update=":form:msgs" />
<p:ajax event="rowEditCancel" listener="#{myMB.onRowCancel}" update=":form:msgs" />
Use your IDs instead of :form, :msgs.
<p:ajax event="rowEdit" listener="#{myMB.onRowEdit}" update="messages tab" />
<p:ajax event="rowEditCancel" listener="#{myMB.onRowCancel}" update="messages tab" />
Also you have to update list "allArticles" by edited object.

Insert textbox in datatable but having difficulty to save all the records

Hi i am adding a textbox in a datatable where the user will input data in each row. I need help on how to save the data...because right now it's saving only the last row. Please see code below, can someone help on this? I think there should be some sort of array but i dont know if it is possible to store value in array using el expression. I implemented a nested datatable since i want the data to be side by side. If you have a better idea other than using datatable , I would be glad if you could share it and give proper instruction on how to proceed. ( but it should be side by side)
Thanks in advance
<p:dataTable id="dta" value="#{MyCarComponent.model}" var="cur" rows="15" >
<p:column>
<f:facet name="header">
<h:outputText value="Model:" />
</f:facet>
<h:outputText value="#{current.cptModel}" />
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="Type:" />
</f:facet>
<p:dataTable id="dta1" value="#{cur.type}" var="curType" rows="15" >
<p:column>
<h:outputText value="#{curType.cptType}" />
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="Origin:" />
</f:facet>
<h:form>
<p:dataTable id="dta3" value="#{curType.origins}" var="curOrigin" rows="15" >
<p:column>
<h:outputText value="#{curOrigin.origin}" />
</p:column>
<p:column>
<h:inputText
value="#{MyCarComponent.origindetails.country}"/>
</p:column>
</p:dataTable>
</h:form>
</p:column>
</p:dataTable>
</p:column>
<f:facet name="footer">
<p:commandButton image="save" ajax="false" value="Save" action=" #. {Mycar.saveMyCar(curOrigin.origin,MyCarComponent.origindetails)}" />
</f:facet>
You're currently binding the input field of all rows to one and same bean property. So when JSF processes the form submit in the same sequence as the component tree, the value of each input field will be set in this one and same property. Of course the property will end up being the one of the last row.
You just need to bind the value of the input field to the currently iterated row, the #{curOrigin}. E.g.
<h:inputText value="#{curOrigin.country}" />
Just create the property of there if it doesn't exist yet.

Primefaces validate cell editing

I'm using cell editor in Primefaces to update cells in a datatable. However I want to validate the input before I confirm the change.
I have used FacesContext.getCurrentInstance().validationFailed(); for this purpose but still getting the cell updated.
This is how I'm implementing it:
<p:dataTable value="#{bean.list}" var="var" id="table" editMode="cell" editable="true">
<p:ajax event="cellEdit" listener="#{bean.onCellEdit}" update="#form"/>
<p:column headerText="Quantity">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{var.quantity}"/>
</f:facet>
<f:facet name="input">
<p:inputText value="#{var.quantity}"/>
</f:facet>
</p:cellEditor>
</p:column>
</p:dataTable>
Bean Method:
public void onCellEdit(CellEditEvent event) {
//validate new value
if(!validate(event.getNewValue())){
//if validation returned false stop updating the cell
FacesContext.getCurrentInstance().validationFailed();
}
}
I want to stop updating the cell if the new value did not pass the validation, but the cell gets updated anyways. How can I solve this problem?
PS: Primefaces 3.5
What you're observing happens because because the celleditor's event happens in the INVOKE_APPLICATION phase, too late for any validation failure to have any effect.
You can just use the plain validator attribute on the <p:inputText/> like you would any other JSF input component. The behaviour will be the same, regardless of the fact that it's a facet of the <p:cellEditor/>

PRIMEFACES: empty p:dataTable (binding problem)

I've simply changed working JSF h:dataTable to p:dataTable, but it's empty. Without headers, one empty row. I've installed primefaces-3.0.M1.jar to my project.
UPDATE: if I remove binding, dataTable is working properly, but without advantages of HtmlDataTable...
UPDATE2: don't anybody knows how to bind rich:dataTable?
Part of code:
<p:dataTable
id="tableDetail"
value="#{myBdeCheck.dataListBde}"
binding="#{myBdeCheck.dataTable}"
var="bdeItem">
<p:column>
<f:facet name="header">
<h:outputText value="Select" />
</f:facet>
<h:selectBooleanCheckbox value="#{myBdeCheck.selectedRow}"/>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="Shift" />
</f:facet>
<h:outputText value="#{bdeItem.dayShift}"/>
</p:column>
<f:facet name="footer">
<h:commandButton id="btnAdd" action="#{myBdeCheck.add}"/>
</f:facet>
</p:dataTable>
Did I forgot something?
This can be caused by binding (as you suggested yourself). You have to bind p:dataTable to
org.primefaces.component.datatable.DataTable
instead of javax.faces.component.html.HtmlDataTable

Resources