I have one problem, data is not getting refresh in datatable.I am opening a dialoge box in which I have accordian panel in acordian panel I have tab in tab I have datatable.
<p:dialog id="dlgAddEditFundsCustFinAcct"
widgetVar="dlgAddEditFundsCustFinAcctWidget" modal="true"
'
.
<p:accordionPanel id="accAEFCFA" widgetVar="accWidget">
<p:tab id="tabDocuments" widgetVar="tabDocumentsWidget">
<p:panel id="pnlDocuments" widgetVar="pnlDocumentsWidget" >
<p:panelGrid id="pgDocumentTable" columns="5">
<p:dataTable id="dtDocumentTable" var="documentRecord" value="#addEditFundsCustFinAcctManagedBean.documentDetails}" widgetVar="documentTable">
And I have properly close all the tab.
And I am trying to call this dialogue box using
<p:commandButton value="Yes" styleClass="button-green"
id="btnAddSellerAccountSsr" oncomplete="confirmAccountDialog.hide(),dlgAddEditFundsCustFinAcctWidget.show()" update=":parentForm:dlgAddEditFundsCustFinAcct" />
"parentForm" is my form name.
The one thing is that if I call update inside the on some event like filtering on column or on rowclick then data is getting refresh in datatable.
<p:commandButton value="Yes" styleClass="button-green" id="btnAddSellerAccountSsr"
oncomplete="confirmAccountDialog.hide(),dlgAddEditFundsCustFinAcctWidget.show()"
update="dtDocumentTable" >
<f:ajax render="dtDocumentTable"/>
</p:commandButton>
use two forms. one for dialog box and other for parentform, and then update dialogbox datatable using its id
Thank You Saurabh and Zaido.
Unfortunatly both solution has not worked for me.
But I have solved the issue by calling clearfilter methode of datatable (this is client side methode).
<p:commandButton value="Yes" styleClass="button-green" id="btnAddSellerAccountSsr"
oncomplete="confirmAccountDialog.hide(),**documentTable.clearFilters();"**
update="dtDocumentTable" >
<f:ajax render="dtDocumentTable"/>
</p:commandButton>
where documentTable is widgetVar of datatable.
Hope this solution will help any one who has same issue :)
Related
I'm using PrimeFaces dataTable and rowEditor in pretty default way:
<p:dataTable id="payments-table" var="apayment" value="#{payment.payments}" editable="true">
<p:ajax event="rowEdit" listener="#{payment.update}"/>
...
</p:dataTable>
I'd like a confirmation dialog to show itself on clicking to the 'check' button of rowEditor.
I know it's possible using JS confirm function (thanks to Show a confirm message before <p:rowEditor> updates the model on click of "OK" button):
<p:ajax event="rowEdit" listener="#{payment.update}" onstart="return confirm('Save changes?')"/>
But I would like the dialog to conform to the UI theme, confirmDialog component being the best candidate. Alas, I don't know how to use it here. I tried the following and it won't work (simply no confirmation occurres):
<p:ajax event="rowEdit" listener="#{payment.update}">
<p:confirm header="Remove payment" message="Remove payment?" icon="ui-icon-trash"/>
</p:ajax>
....
<p:confirmDialog global="true">
<h:form id="form-payment-confirm">
<p:commandButton value="Yes" type="button" styleClass="ui-confirmdialog-yes" icon="ui-icon-check"/>
<p:commandButton value="No" type="button" styleClass="ui-confirmdialog-no" icon="ui-icon-close"/>
</h:form>
</p:confirmDialog>
Any ideas?
I think you can use in this case simple widgetVar and call show() or hide() functions. Here is your modified code:
<p:ajax event="rowEdit" listener="#{tableBean.onRowEdit}" oncomplete="myDialog.show()"/>
I use PF 3.5 and can't find global parameter in p:confirmDialog. May be it is new feature. So I simple deleted it of my code. Here is modified confirmDialog:
<p:confirmDialog widgetVar="myDialog" closeOnEscape="true" appendToBody="true" closable="true">
<h:form id="form-payment-confirm">
<p:commandButton value="Yes" type="button" update="#form" styleClass="ui-confirmdialog-yes" icon="ui-icon-check"/>
<p:commandButton value="No" type="button" onclick="myDialog.hide()" styleClass="ui-confirmdialog-no" icon="ui-icon-close"/>
</h:form>
</p:confirmDialog>
Please try and adjust this confirm dialog code! May be unnecessary code for update form or hide()...
EDIT:
If you want to dynamically adjust text message of confirmDialog, you can adjust from server-side. Perhaps it is not best solution. I think the second way is it adjust from client-side by JQuery.
Server-side:
The ajax event is same. It call onRowEdit listener which adjust simple String attribute. For example the bean containt:
String myDialogMessage = "Default message";
//getter and setter
public void onRowEdit(RowEditEvent event) {
myDialogMessage="Are you sure?";
}
and the dialog containt message property:
<p:confirmDialog widgetVar="myDialog" closeOnEscape="true" appendToBody="true" closable="true" message="{tableBean.myDialogMessage}">
Client-side:
You can use repleaceWith function of JQuery:
<script>
jQuery("myDialog.p").replaceWith(....
</script>
Of course need to develop more business logic to client-side, more functions. Maybe the server-side solution is faster.
Please try it!
Based on your comment, I edited:
I find this in 4.0 user' guide:
When pencil icon is clicked, row is displayed in editable mode meaning
input facets are displayed and output facets are hidden. Clicking
tick icon only saves that particular row and cancel icon reverts the
changes, both options are implemented with ajax interaction. Another
option for incell editing is cell editing, in this mode a cell
switches to edit mode when it is clicked, losing focus triggers an
ajax event to save the change value.
So ajax event works when row is change. Here is dataTable events which can you catch:
I hope this answer help to you find solution!
JSF-2.1 Primefaces 3.5 I have a datatable with Filter. I need to update only data on datatable(without Filter). Because everytime when i update the datatable, i lost the text in Filter Field.
I have one dialog, and the confirm button is outside the datatable's form
How can i fix it?
Thanks
<h:form id="form">
<p:dataTable id="cm_dataTable_#{cc.clientId}" widgetVar="cm_dataTableWidget_#{cc.clientId}" var="adr" value="#{cc.attrs.addresses}"rowIndexVar="rowIndex" filterDelay="1000" binding="#{cc.dataTable}" rowKey="#{adr.mailingadresseid}" selection="#{mailingadressenBean.selectedAddresses}">
<p:column id="colistuploadmeinedaten" filterBy="#{adr.firstname}" filterMatchMode="exact" filterOptions="#{mailingadressenBean.siTrueFalse}" sortBy="#{adr.istuploadmeinedaten}">
<h:outputText value="#{adr.anrede}" />
</p:column>
</p:datatable>
</h:form>
and the Dialog's confirmbutton
<p:commandButton id="dm_yesBttn" value="#{langs.yes}" update=":form" actionListener="#{deleteMailingadresseBean.delete}" oncomplete="hideDeleteDialog(xhr, status, args)"/>
You can't (PrimeFaces 3.5) directly bind datatable filters with JSF bean, so they will not be preserved when you update the whole component.
But if you call filter() on datatable widget, the data will be reloaded from server, without re-rendering the whole datatable component (so the filters will be preserved)
<p:dataTable .... widgetVar="myTable"> ...</p:dataTable>
<p:commandButton action="#{myBean.doSth}" .... oncomplete="myTable.filter()"/>
I´m using o:ignoreValidationFailed, but it doesn´t work inside the ui:repeat. When I do the same outside, it works! I tried with mojarra ans MyFaces... I´m using primefaces. If there is another way to skip the validations only for one button...
<o:form id="rateplanEditByPeriod" prependId="false">
<p><p:messages id="mensagensDlg"/></p>
<p:tabView id="tabs">
<p:tab title="Cancelamento" id="tabCanc">
<h:panelGrid id="cancelationsTable" columns="2" cellpadding="10px" columnClasses="alignTop,alignTop">
<ui:repeat id="repeat" var="rest" value="#{rateplanByPeriodManaged.rateplanByPeriod.restriction.restTypeCancelation.restTypeCanConfs}" >
<h:panelGrid columns="8">
<p:inputText id="penaltyValue_#{loop.index}" value="#{rest.penalityValue}" style="width:28px" label="Valor" title="Valor" disabled="#{rest.noCancel}" required="true"/>
<p:commandLink id="add_#{loop.index}" actionListener="#{rateplanByPeriodManaged.addCancConf}" update=":rateplanEditByPeriod:tabs:cancelationsTable" partialSubmit="true" process=":rateplanEditByPeriod:tabs:cancelationsTable" value="+">
<o:ignoreValidationFailed />
</p:commandLink>
<p:commandLink actionListener="#{rateplanByPeriodManaged.removeCancConf(rest)}" value="-" update=":rateplanEditByPeriod:tabs:cancelationsTable" partialSubmit="true" process=":rateplanEditByPeriod:tabs:cancelationsTable">
<o:ignoreValidationFailed />
</p:commandLink>
</h:panelGrid>
</ui:repeat>
</h:panelGrid>
</p:tab>
</p:tabView>
<p:commandLink styleClass="button" onclick="dlgEdit.hide()" immediate="true" update=":msgsPanel">#{msgs['inventory.editByPeriod.cancel']}</p:commandLink>
<p:commandLink styleClass="button" actionListener="#{rateplanByPeriodManaged.editByPeriod(loginManaged.hotelSelected)}" oncomplete="if (!args.validationFailed) {dlgEdit.hide(); updateAllSearches(); updateAllNotifications();}" update="mensagensDlg, tabs" >#{msgs['inventory.editByPeriod.confirm']}</p:commandLink>
</o:form>
I have faced the same issue but with p:datatable
I solved it with
1- add a condition to the required field to know if the ajax come from submit button or not
as #Camilla said.
required="#{!empty param['trans_desc_form:savetransid']}"/>
trans_desc_form is the entire form id and savetransid is the submit button save id
2- I removed #NotNull from my JPA entity which force the validation
#JoinColumn(name = "ITEMNO", referencedColumnName = "ITEMNO")
#ManyToOne(optional = false, fetch = FetchType.LAZY)
//#NotNull
private Item item;
I have created a question for this issue
ignoreValidationFailed doesn´t work inside p:dataTable
I don´t know if it´s the best aproach but it worked for me...
<h: inputText id="text1" value="" required="#{!empty param['formName:btnSave']}" />
This is not the right way to have a "Cancel" button.
Just put process="#this" in the <p:commandLink>, or if you don't need to do any business logic, make it a normal <h:link> which reloads the page (and thus implicitly recreates the request/view scoped bean).
As to <o:ignoreValidationFailed> the failure in <ui:repeat> on its own, please create an issue.
i have the following problem:
I'm new to JSF2 and primefaces.
I have a table in a page that will be populated with information, after the user enters a string and clicks a CommandButton. After clicking the button, I want it to be disabled until processing is over.
To disable the CommandButton I'm doing the following;
<p:commandButton update=":outPanel" widgetVar="btnSend" id="btnsend"
value="Calcular" actionListener="#{calcBean.getTrfs}"
onclick="btnSend.disable()" oncomplete="btnSend.enable()" />
And then I have a panel where I want to show its contents:
<p:panel id="outPanel" widgetVar="outpanel">
#{calcBean.result}
</p:panel>
How can I hide this outpanel when the page loads the first time?
How can I hide it when I click the CommandButton, and only show it again if the processing in my bean is successful?
Thanks.
Solved,
i have to put
closable="true" toggleable="true"
attributes in p:panel... Thanks
I have checked following panel hide and show using p:commandButton in JSF,
please try following methods in JSF,
<p:panel id="button_panel" widgetVar="testPanel" closable="true" toggleable="true">
<h1>Testing</h1>
</p:panel>
<p:commandButton onclick="PF('testPanel').show()" value="Show Panel" type="button"/>
<p:commandButton onclick="PF('testPanel').hide();" value="Hide Panel" type="button"/>
to show the panel after the ajax request is finished try this:
<p:commandButton update=":outPanel" widgetVar="btnSend" id="btnsend"
value="Calcular" actionListener="#{calcBean.getTrfs}"
onclick="btnSend.disable()" oncomplete="btnSend.enable();outPanel.show();" />
I am using JSF 2.0 and primefaces 3.0
I am trying to enable a command(Submit) button after a row select from datatable
<p:datatable ....>
<p:ajax event="rowUnselect" onstart="showImageButton.disable();" />
<p:ajax event="rowSelect" onstart="showImageButton.enable();" />
</p:datatable>
<p:commandButton id="commandbuttonid" widgetVar="showImageButton" action="#{bean.methodreturningapage}" value="Submit"
ajax="false" disabled="true" />
after selecting the rows command button gets enabled but the action method is not firing.
Change the disabled attribute into something like #{bean.buttonDisabled}
take a look on this question
p:commandButton not working when disable=“true” initially
and this one
Re-enabled p:commandButton not firing ajax