I'm using primefaces inline editing datatable.which consists of primefaces RowEditor and a CommandButton to delete the record.My Problem is when i deleted any record from the the database,the row is successfully deleted and the deleted record is showing when i click on the edit button for editing the next record.This edit problem continues with all the records .It is showing the present value in h:outputText and the old value in h:inputText which comes when we click on edit button.
Could anyone help me on this ?
Thankyou all.
There are a lot of Primefaces bugs logged on the <p:dataTable> component, so I am not going to search through all of them.
I do know however that there is an open bug as of Primefaces 2.2.1 stating that components within a row of a <p:dataTable> will not correctly update (refresh) the appropriate values within the dataTable. This problem MAY be fixed in Primefaces 3.0. If you are interested you can search the known bugs here.
Fortunately I have figured out a workaround for this. You need to perform an asynchronous operation from a component OUTSIDE of the <p:dataTable> and make sure that component sets the id of the dataTable in its update attribute.
<h:form id="form1">
<p:commandButton widgetVar="updateButton" update="form1:table1" ... />
<p:dataTable id="table1" ...>
<p:column ...>
<p:commandButton id="deleteButton" action="#{managedBean.doDelete}" oncomplete="javascriptFunction();" ... />
</p:column>
</p:dataTable>
</h:form>
And in a javascript:
function javascriptFunction() {
updateButton.jq.click();
}
Related
I'm using PrimeFaces and I have a line:
<p:ajax update="toUpdate">
the problem is, that this ID not always exists on the page.
( the page is dynamic and sometimes it contains a part that have this specific ID and sometimes not)
When it exists, it works great, but when the ID doesn't exist, the component crash - (probably it's some validation issue)
How can I fix it?
Is it a well known issue?
Thanks!
You need to provide an always rendered component to update, for example:
<p:ajax update="toUpdate">
<h:panelGroup id="toUpdate">
<p:dataTable id="tableID" rendered="#{bean.someCondition>"...
</h:panelGroup>
So, if you have a component that can be o or not visible, do not use it for update, because can be out of components tree. Instead, use a component (container) that your are sure that be rendered and present in the components tree.
Try this code
<f:ajax render="toUpdate">
<h:outputText id="toUpdate">
<!-- do something -->
</h:outputText>
I'm making form with dropdowns, where user have to make first choice, than using ajax next choices appear. It works just fine. But I wanted to add bootstrap formatting for dropodwns, so I installed bootstrap-select. It work also just fine, but when ajax event renders data for next he renders it in a new dropdown, next to still empty bootstrap formated dropdown. Witch, how can you predict, isn't desired action. Here's code from jsf:
<h:selectOneMenu styleClass="bootstrap-select" id="marka" value="#{searchBean.markiID}">
<f:selectItems value="#{searchBean.listaMarek}" var="c" itemLabel="#{c.marka}"
itemValue="#{c.markaID}"/>
<f:ajax event="change" execute="marka" render="model"/>
</h:selectOneMenu>
<h:outputText value="#{msg.carModel}"></h:outputText>
<h:selectOneMenu styleClass="bootstrap-select" id="model" value="#{searchBean.modelID}">
<f:selectItems value="#{searchBean.listaModeli}" var="p" itemLabel="#{p.model}"
itemValue="#{p.modelID}"/>
<f:ajax event="change" execute="model" render="liczbaDrzwi"/>
</h:selectOneMenu>
In backingbean, when user choose smthging from first dropdown, Is generated list of items for second dropdown, and so on. And this is the result of making choice:
As you can see, ajax makes totally new dropdown, instead of filling already existing.
Thanks for any ideas:)
JSF Ajax works in this way... instead of filling the already existing dropdown... the jee server send a new HTML fragment to replace this dropdown code...
Maybe you could read this link to understand JSF lifecycle...jsf lifeclycle
Did you try using primefaces or richfaces instead of h:selectOneMenu component?
Here is a PrimeFaces example where you can see how to update one dropdown when you select a value on another dropdown... pf example
I have the following configuration:
JSF: Apache MyFaces JSF-2.1 Core API (Version: 2.1.10)
PrimeFaces 3.4.2
Tomcat 7.0.35
I have a DataTable with rowExpansion and a panel with button in the rowExpansion. I would like to refresh only the panel inside the rowExpansion when the user clicks on the button.
<p:dataTable id="vmt" var="vmtemplate" value="#{myViewBean.myList}" rowKey="#{vmtemplate.id}">
<p:ajax event="rowToggle" listener="#{myViewBean.onRowToggle}" update=":growl" />
<p:column style="width:2%"><p:rowToggler /></p:column>
<p:column>...</p:column>
<p:rowExpansion>
<p:panel id="exp_panel" header="#{vmtemplate.name} Instances">
<h:form id="instancesForm">
<p:commandButton id="refreshRowExpPanel" title="Refresh" update=":growl" action="#{myViewBean.reloadData}"/>
</h:form>
</p:panel>
</p:rowExpansion>
</p:dataTable>
I think I have to set the update property of the refreshRowExpPanel button in order to refresh the exp_panel, but when I set it to update=":growl :expanel" I get an error:
Cannot find component with identifier ":expanel" referenced from
"mainForm:vmt:0:refreshRowExpPanel".
so the generated ID of the panel is "mainForm:vmt:0:refreshRowExpPanel", but when I specify this to the update (update=":mainForm:vmt:0:refreshRowExpPanel") I got the same error:
Cannot find component with identifier
":mainForm:vmt:0:refreshRowExpPanel" referenced from
"mainForm:vmt:0:refreshRowExpPanel".
with update=":mainForm" it works, but it refreshes the whole dataTable and my expanded row will be closed, so it's not fine.
Could you please suggest a solution how to refresh only my panel inside the rowExp, maybe from JS, or any other idea?
thx!
I recommend you to try using ID of the panel without colon on the beginning, so:
update="mainForm:vmt:0:refreshRowExpPanel"
Also you may like to read this post about making references.
I've just realized, that I had a form outside my dataTable:
<h:form id="outerForm">
<p:dataTable id="vmt" var="vmtemplate" value="#{myViewBean.myList}" rowKey="#{vmtemplate.id}">
pansion>
...
</p:dataTable>
</form>
by removing the outer form, and changing the update value to "#form" solved the problem
I'm using JSF with PrimeFaces to make an application as an assignment for college. I'm struggling to get something working. I'm using PrimeFaces and I have a tabview which contains 5 tabs. In one of those tabs I have a dataTable which has several rows and columns. This all works fine, but the problem is that I want to submit the form without rerendering the (entire page). The thing is, every column in the dataTable has a selectBooleanCheckbox, and when that checkbox is selected, a button should disappear. If it's unselected the button should appear. This works fine with onchange="this.form.submit()" or onclick="this.form.submit()" but it refreshes the entire application, and it causes the first tab to be selected, rather than the one I was at. So I'm looking for a solution to be able to submit and re-render some stuff without refreshing the entire program. This is my code:
<body>
<h:form id="customerForm">
<p:dataTable id="customerlist" var="c" value="#{customerBean.customerList}">
<p:column>
<f:facet name="header">Select</f:facet>
<center>
<p:selectBooleanCheckbox value="#{c.selected}" onchange="this.form.submit()"/>
</center>
</p:column>
</p:dataTable>
<h:commandButton id="testtest" value="test" rendered="#{customerBean.numberSelected() == 0}"/>
</h:form>
</body>
I removed most of the columns for the sake of simplicity. What is the solution to this? I've tried using ajax, but that didn't work
<p:selectBooleanCheckbox value="#{c.selected}">
<f:ajax event="click" execute="#form" render="#none"/>
</p:selectBooleanCheckbox>
Do you really need to submit the whole form? If it's enough that the view is being rerenderd try just to update the form. For that you can use the primefaces ajax event.
<p:selectBooleanCheckbox value="#{c.selected}">
<p:ajax update="#form"/>
</p:selectBooleanCheckbox>
If this does not work, please tell us what "..ajax, didn't work" exactly mean. Is there any POST Request submitted? Is any Action/Setter called?
Have review(for adding review or comments) component in my application.
When add review, that p:dataTable is updated with ajax.
before adding review:
after adding first review
refresh page(F5):
after adding second review:
jsf:
<h:form onsubmit="return commValidator();">
<h:inputText value="#{comment.commentator}"/>
<h:inputTextarea value="#{comment.body}";"/>
<p:commandButton value="send" action="#{showProducts.addComment}" update="comms"/>
<p:dataTable id="comms" value="#{showProducts.comments}" var="com">
<p:column>#{com.commentator}(
<h:outputText value="#{com.postDate}">
</h:outputText>):
</p:column>
<p:column>#{com.body}</p:column>
</p:dataTable>
</h:form>
The problem is p:dataTable component is displayed twice on page.
After new review been added, that newly created p:dataTable displayed.
How to make p:dataTable displayed already after go to page and once time?
Thanks.
p:dataList component resolves this problem
It displays ones and new elem. is added to already existing list instead of creating new one list as with p:dataTable!
forum
I encountered the same problem: p:dataTable inside form is duplicated, each time an update(:form) is made.
One possibility to solve the problem is to put a p:outputPanel as major element inside the form which contains all other elements.
When simply doing an update(:form:outputpanel) the table is update BUT not duplicated anymore.