I would like to display in a dialog the number inserted in the inputText.
<p:inputText id="nbr"
type="number"
value="#{MB.number}"
required="true"
label="nbr" />
<p:confirmDialog id="confirmPurchase"
message="Your Database was successfully created. And contains "
appendToBody="true"
header="Buy Emails List"
severity="info"
widgetVar="purchase">
<a class="boldtext">
#{MB.number}
<h5> datas</h5>
</a>
<p:commandButton id="confirm" value="Buy" actionListener="#{MB.buy())}" />
<p:commandButton id="decline"
value="Decline"
onclick="purchase.hide();"
type="button" />
</p:confirmDialog>
The code below returns always 0 as a number in the confirm dialog.
Update1
the dialog is showing once the action in the commandButton is completed
<p:commandButton value="Extract" update="table nbr" id="ajax" ajax="true" widgetVar="extractButton action="#{MB.search()}" oncomplete="purchase.show();"/>
First of all, you need a <h:form/> around your <p:inputText> and your <p:commandButton>.
Your <p:commandButton> should have the attribute update=":outputUserText".
Inside your Dialog, you need a <p:outputLabel id="outputUserText" value="#{MB.number}"
Related
I would like to call the action after click the commandLink and that choose ok to confirm and fire the action in the commandlink. But I could only open a modalPanel and close it. But the action is not invoked in the a4j:commandLink. May I ask how could I fire the action after choose "OK" of the modalPanel?
<a4j:commandLink
action="#{confManager.deleteValue(deleteValue)}"
onclick="#{rich:component('confirmation')}.show();return false"
value="#{messages.deleteLabel}"
title="#{messages.deleteHint}"
propagation="none"
reRender="systemPropertiesTable">
</a4j:commandLink>
<rich:modalPanel id="confirmation" width="210" height="100">
<f:facet name="header">#{messages.systemPropertyConfirmDialogHeader}
</f:facet>
<h:panelGrid>
<h:panelGrid columns="2">
<p><h:outputText value="#{messages.systemPropertyConfirmDialogContent}" /></p>
</h:panelGrid>
<h:panelGroup>
<input type="button" value="OK"
onclick="#{rich:component('confirmation')}.hide();submit();return false" />
<input type="button" value="Cancel"
onclick="#{rich:component('confirmation')}.hide();return false" />
</h:panelGroup>
</h:panelGrid>
</rich:modalPanel>
Did you try to transform the OK button into a a4j:commandButton and move the action on the OK button ?
You could save the "deleteValue" in your bean with an actionListener and effectively delete it if the user clicks "OK".
I have an inputTextArea in a dialog and wanted that the bean property shouldn't be sent/changed when the user clicks on the cancel button, but it does.
<p:dialog header="Notizen" id="paketNotizenDialog" modal="true"
widgetVar="paketNotizenDialogWV">
<h:form>
<p:panelGrid columns="1">
<p:inputTextarea scrollHeight="200" rows="6" cols="33" autoResize="false"
value="#{paketErstellenDialogController.selectedPaket.notiz}" />
</p:panelGrid>
<p:commandButton value="Save" process="#form" oncomplete="PF('paketNotizenDialogWV').hide();"/>
<p:commandButton value="Cancel" oncomplete="PF('paketNotizenDialogWV').hide();" process="#none" update="#none" />
</h:form>
</p:dialog>
The button which opens the dialog:
<p:commandButton id="notizEintragButton" value="T" process="#this"
onclick="PF('paketNotizenDialogWV').show();" />
Any hints? Thanks in advance.
As you are using the commandButton, the default behaviour would be to submit the enclosing form with ajax request.
I suspect what you want to do here is to reset the form input and close the dialog. In that case you should go for the type="reset" which according to the primefaces doc:
Reset buttons do not submit the form, just resets the form contents.
And once that is done, trigger your closing javascript code:
<p:commandButton value="Cancel" type="reset"
onclick="PF('paketNotizenDialogWV').hide();"/>
If you do not want to reset the form, just close the dialog then use:
<p:commandButton value="Cancel" type="button"
onclick="PF('paketNotizenDialogWV').hide();"/>
Which according to the primefaces doc would:
Push buttons are used to execute custom javascript without causing an
ajax/non-ajax request. To create a push button set type as "button"
Update
If you want to reset the values from the backing bean then use reset input fields functionality of primefaces.
In your case it would be something like:
<p:panelGrid columns="1">
<p:inputTextarea id="input" scrollHeight="200" rows="6" cols="33" autoResize="false"
value="#{paketErstellenDialogController.selectedPaket.notiz}" />
</p:panelGrid>
<p:commandButton value="Cancel" oncomplete="PF('paketNotizenDialogWV').hide();"
process="#this" update="input" >
<p:resetInput target="input" />
</p:commandButton>
just add type="button" and remove process="#none" update="#none"
from <p:commandButton value="Cancel" oncomplete="PF('paketNotizenDialogWV').hide();" process="#none" update="#none" />
I am trying to delete data table values. my data tables shows lot of values. when i click to delete particular row in my data table then confirmation dialog box open. if click okay then call to bean and delete that values to database. if click cancel then not to call to bean.. this is my functionality..
ex:
my data table show 10 rows. when i select 1 rows delete button clicked call to bean but its get another rows values pass to bean...
my UI code..
<h:commandButton image="/images/remove.png" onclick="# {rich:component('confirmation')}.show();return false"/>
<a4j:jsFunction name="submit" action="#{bean.delete}">
<f:setPropertyActionListener target="#{bean.name}" value="#{info.name}" />
</a4j:jsFunction>
<rich:popupPanel id="confirmation" width="250" height="150">
<f:facet name="header">confirmation</f:facet>
<h:panelGrid>
<h:panelGrid columns="2">
<h:graphicImage value="/images/remove.png" />
<h:outputText value="Are you sure?" style="FONT-SIZE: large;" />
</h:panelGrid>
<br></br>
<h:panelGroup >
<center><input type="button" value="OK"
onclick="#{rich:component('confirmation')}.hide();submit();return false" />
<input type="button" value="Cancel"
onclick="#{rich:component('confirmation')}.hide();return false" /> </center>
</h:panelGroup>
</h:panelGrid>
</rich:popupPanel>
I guess it has something to do with the 'AJAX calls out of sync'
The posted code lacks the table info so ill assume it has something to do with the AJAX handling.
<rich:extendedDataTable
id="myTable"
value="#{myBean.rows}"
selectionMode="single"
rows="#{crudBean.actionForm.occurrences}"
...
rowKeyVar="idx"
...>
<a4j:ajax event="selectionchange"
listener="#{myBean.selectionListener}"/>
<rich:column width="30px" styleClass="#{rowItem.className}">
<util:myInputText id="status" managedBean="#{myBean}" rowItem="#{rowItem}" rowIndex="#{idx}"/>
</rich:column>
<util:myDeleteRecord id="delete" managedBean="#{myBean}" rowItem="#{rowItem}" rowIndex="#{idx}"/>
</rich:column>
</rich:extendedDataTable>
On my components i use: rowIndex="#{idx}" to make sure i know on which row i'm editing/removing
When a row in <p:dataTable> is right-clicked, <p:contextMenu> appears with a delete option. When this option is clicked, <p:confirmDialog> appears with two buttons Yes and No - a conformation warning about deleting the current row as follows.
<p:contextMenu for="dataTable">
<p:menuitem oncomplete="confirmDelete.show()"
value="Delete"
update="confirmDialog"
process="#this dataTable"
actionListener="#{testManagedBean.deleteActionListener}"
icon="ui-icon-close" ajax="true"/>
</p:contextMenu>
<p:confirmDialog id="confirmDialog"
widgetVar="confirmDelete"
message="#{testManagedBean.message}"
header="Message"
severity="alert"
closeOnEscape="true"
showEffect="slide"
hideEffect="fold"
appendTo="#(body)"
closable="true">
<p:commandButton id="btnYes"
value="Yes"
process="#this"
oncomplete="confirmDelete.hide()"
actionListener="#{testManagedBean.deleteActionListener}"
update="dataTable"/>
<p:commandButton id="btnNo"
value="No"
onclick="confirmDelete.hide()"
type="button" />
</p:confirmDialog>
Is there a way to set the message attribute with a formatted message on this dialog.
For example, the property testManagedBean.message in its managed bean is set to a string like
You are about to delete <font color='#ff0000'>2</font> rows. <br/>This action will never be undone. <br/>Are you sure?
The confirm dialog displays this string as a whole. HTML in this string should be interpreted as HTML. I don't see any attribute like escape in <p:confirmDialog>.
Is there a way to display this string as a formatted message.
I found an ugly solution nesting of <f:facet name="message"> within <p:confirmDialog>.
<p:confirmDialog id="confirmDialog"
widgetVar="confirmDelete"
header="Message"
severity="alert"
closeOnEscape="true"
showEffect="slide"
hideEffect="fold"
appendTo="#(body)"
closable="true">
<p:commandButton id="btnYes"
value="Yes"
process="#this"
oncomplete="confirmDelete.hide()"
actionListener="#{testManagedBean.deleteActionListener}"
update="dataTable"/>
<p:commandButton id="btnNo"
value="No"
onclick="confirmDelete.hide()"
type="button" />
<f:facet name="message">
<h:outputFormat value="#{testManagedBean.message}" escape="false"/>
</f:facet>
</p:confirmDialog>
Removing the message attribute from <p:comfirmDialog> and nesting <f:facet name="message"> inside it.
Note : <h:outputFormat> is only needed, if one or more parameters need to be passed by means of nested <f:param> to be substituted in respective placeholders ({0}) in the message text. Just keep on using <h:outputText escape="false">, if no such parameters need to be passed.
I have an h:selectOneMenu set up that looks something like this:
<f:view>
<h:form id="tehForm">
<h2>Header</h2><br/>
<a4j:outputPanel id="msgPanel" ajaxRendered="true">
<h:messages styleClass="message"/>
</a4j:outputPanel>
<a4j:outputPanel id="mainPanel" ajaxRendered="true"><br/>
Select an item:<br/>
<h:selectOneMenu id="itemMenu" value="#{bean.itemId}">
<f:selectItem itemValue="-1" itemLabel="Please Select..."/>
<s:selectItems value="#{bean.item}" itemValue="#{item.id}" var="item" label="#{item.name}"/>
<a4j:support event="onchange" action="#{bean.selectItem}"/>
</h:selectOneMenu>
<rich:spacer width="10px"/>
<a4j:commandLink value="Create New" action="#{bean.createNew}"
rendered="#{bean.selectedItemId != 0}"/>
<h:outputText rendered="#{bean.selectedItemId gt -1}" value="Item Name: "/><br/>
<h:inputText rendered="#{bean.selectedItemId gt -1}" value="#{bean.selectedItem.name}" maxlength="50" size="75"/><br/><br/>
<a4j:commandButton value="Save New" action="#{bean.save}" rendered="#{bean.selectedItemId == 0}"/>
<a4j:commandButton value="Save Changes" action="#{bean.save}" rendered="#{bean.selectedItemId gt 0}" oncomplete="jsRerender();" />
<a4j:jsFunction name="jsRerender" rerender="mainPanel"/>
</a4j:outputPanel>
</h:form>
</f:view>
When creating new items, the new item does show up in the drop-down, but if I change the "name" attribute of my item and save, the label doesn't change to the new name until after the next request, despite the data in the bean having changed.
So I worked around it by forcing a second call to rerender again when saving changes is complete. The trouble is, this rerenders the messages panel as well, so I nuke any messages that may have been displayed. Using limitToList="true" in the a4j:jsFunction has the same effect as not calling it.
I need suggestions; either a new target for the rerender function, or another way of approaching the problem. Thanks in advance!
Try removing the oncomplete javascript and using reRender="mainPanel":
<a4j:commandButton value="Save Changes"
action="#{bean.save}"
rendered="#{bean.selectedItemId gt 0}"
reRender="mainPanel" />
In your version I think that "Save Changes" button without reRender attribute will rerenders all the page, thus refreshing the messages.