i have some problem when calling commandButton in primefaces
here's my code
<h:form>
<some component...>
<p:ajax update="tipe" oncomplete="PF('tipePanel').show()"/>
</some component...>
<p:panel id="tipe" visible="false" rendered="true" widgetVar="tipePanel">
<p:commandButton value="Add"
actionListener="#{soal.addDetailForm()}"
rendered="true" />
</p:panel>
</h:form>
The problem is the button can't be called when the panel is showed, but if i put the panel visible="true" from the start, the button can be called. Any idea why ?
And how should i make the button works when the panel is showed. Thanks
Related
I have this code:
<h:form>
<h:button value="SHOW" onclick="PF('myPanel').show()" />
<p:dialog header="MyPanel" widgetVar="myPanel">
<h:outputText value="Resistance to PrimeFaces is futile!" />
</p:dialog>
</h:form>
Clicking the button only flashes the dialog -- opens and immidiatelly closes it. Also tried using JSF commandButton with same result. Using a primefaces button works as expected, so what is JSF button missing here?
use <p:commandButton> instead.
<p:commandButton value="Basic" type="button" onclick="PF('dlg1').show();" />
I need a rich:popup that shows a rich:extendedDataTable, and when the user presses a button, the popup should be shown, and the extendedDataTable must be re-rendered, here is the code:
<rich:popupPanel id="popupId" show="false" modal="true">
<h:form>
<rich:extendedDataTable
value="#{bean.list}"
var="item" rows="5" id="table">
<rich:column>
<h:outputLabel value="#{item}" />
</rich:column>
</rich:extendedDataTable>
<a4j:commandButton value="x" immediate="true"
oncomplete="#{rich:component('popupId')}.hide(); return false;"/>
</h:form>
</rich:popupPanel>
<h:form>
<a4j:commandButton value="show"
oncomplete="#{rich:component('popupId')}.show(); return false;"
render="table" immediate="true" />
</h:form>
The first time I press the show it works fine, but when I close the panel with the X button and press again the show button, the extendedDataTable appears empty (It's rendered but appear empty, see image below).
The problem is fixed if I add an empty extendedDataTable before the popup, like this:
<rich:extendedDataTable />
<rich:popupPanel>
...
With rich:dataTable the problem doesn't exits, but I need a extendedDataTable.
And aditional extrange behaviour is when I resize the browser, the data appears.
Platform
RichFaces: 4.2.2.Final
Spring: 3.1.1.RELEASE
Cheers
Use onclick instead of oncomplete. ExtendedDataTable doesn't render properly inside invisible elements (it's a bug) so the popupPanel has to be made visible before the rerendering.
I had kinda the same issue.
I solved it in a not 100% richface correct way:
<a4j:commandButton
value="show"
action="#{actionForm.setShowEditor('true')}"
oncomplete="javascript:location.reload(true)"/>
<a4j:region layout="block" rendered="#{actionForm.showEditor}" id="panelArea">
<rich:popupPanel id="#{popupID}" modal="true" show="true" domElementAttachment="parent">
....
tabel
buttons
....
</rich:popupPanel>
</a4j:region>
The popup is always shown (show="true") inside the a4j:region.
But the a4j:region is only shown if variable to show the popup = true.
The full page refresh was in my case needed because otherwise my ckeditor had some initialisation errors. It should also work if you only rerender the a4j:region after you set the "#{actionForm.setShowEditor('true')}.
I have a Dialog and a CommandLink which shows this dialog. In this Dialog i display values which has created during the action (or propertyListener) of the command link. But because the update is executed before the action, the variables are not set.
<p:commandLink update="#form:myDialog" action="#{myBean.setText('text')}"
oncomplete="myDialog.show()">
</p:commandLink>
....
<p:dialog widgetVar="myDialog" modal="true">
<p:inputText value="#{myBean.text}" />
</p:dialog>
Is it possible to execute an action before the update is done?
I dialog will update you haven't specified the Id attribute of the dialog
<p:commandLink update="myDialog" action="#{myBean.setText('text')}"
oncomplete="myDialog.show()">
</p:commandLink>
<p:dialog Id="myDialog" widgetVar="myDialog" modal="true">
<p:inputText value="#{myBean.text}" />
</p:dialog>
This will help you .
But what i prefer is use an outputpanel
<p:commandLink update="myDialogPanel " actionlistner="#{myBean.setText('text')}"
oncomplete="myDialog.show()">
</p:commandLink>
<p:dialog Id="myDialog" widgetVar="myDialog" modal="true">
<p:outputPanel Id=myDialogPanel >
<p:inputText value="#{myBean.text}" />
</p:outputPanel>
</p:dialog>
or you can update the dialog from managedBean and show the dialog. This is helpful if you get any error at your managedBean method your dialog is not show.
RequestContext.getCurrentInstance().update("myDialogPanel");
RequestContext.getCurrentInstance().execute("myDialog.show();");
You can open the Dialog from ManagedBean itself.
RequestContext.getCurrentInstance().execute(myDialog.show());
RequestContext can be used to Execute any javascript from ManagedBean.
You can also update the components from Managed Bean using RequestContext's Update
method.
RequestContext.getCurrentInstance().update("COMPONENT_ID");
I am using primefaces dialogbox for popup purpose. But everytime it gets opened the whole screen get refreshed automatically and the popup disappears.
< p:dialog id="dialog" header="Select different user" styleClass="atf-header" widgetVar="dlg" appendToBody="true">
<ui:include src="searchpopup.xhtml" />
</p:dialog>
<h:panelGroup>
<h:outputLabel value="#{I18N['Create_Ticket_for_other_users']}" styleClass="atf-header" style="width:600px"></h:outputLabel>
</h:panelGroup>
<h:panelGroup id="search_section" layout="block"
styleClass="atf-content-area atf-separarot-botton" style="width:600px">
<h:panelGroup id="input_search_section" >
<h:outputText id="name" value="Siddharth Mishra"
labelStyleClass="atf-label">
</h:outputText>
</h:panelGroup>
<h:panelGroup styleClass="atf-right atf-inline-block">
<p:commandButton id="btn_search" value="select different user"
styleClass="atf-button-search" onclick="dlg.show()">
</p:commandButton>
</h:panelGroup>
</h:panelGroup>
You p:commandButton is AJAX button (which is default in primefaces) which submits whole form. Add type="button" attribute to it so it will be just ordinary button which do some JavaScript (so called push button). Also I don't see where is h:form tag here. As you have appendToBody="true" in you p:dialog be shore that you don't encapsulate p:dialog inside h:form. You should have h:form inside p:dialog if it is necessary, and if it is not move p:dialog outside of h:form.
Hi I followed this code but my logout button is not at the right side of menubar.
sample from PF
here is my xhtml page
<h:body>
<p:menubar autoDisplay="false">
<p:menuitem value="Home" url="/index.jsf" />
<p:submenu label="Maintenance" >
<p:menuitem value="Course" url="/views/course/list.jsf" />
<p:menuitem value="Student" url="/index.jsf" />
</p:submenu>
<f:facet name="options">
<p:commandButton type="button" value="Logout" icon="ui-icon-extlink" />
</f:facet>
</p:menubar>
</h:body>
You should use a style="float: right;" inside the button or include the property into your css stylesheet.
I am able to get the logout to the right by using the below code
<f:facet name="options">
<p:commandButton type="button" value="Logout" />
</f:facet>
Use: inputText style="margin-right:10px" in the facet... Surely will work.
It will work only in primefaces 3.5 change to primefaces 3.5 and it will work you can verify this at primefaces link primefaces blog
For more details go to primefaces showcase page primefaces showcase menubar sample page for sample code this code is from that sample page
<f:facet name="options">
<p:inputText style="margin-right:10px"/>
<p:commandButton type="button" value="Logout" icon="ui-icon-extlink" />
</f:facet>
if your using prime-faces 5, then it should work. Try to browse your application in a web browser instead of the IDE your using to code. Because It's not appear as we expected in the IDE but it's work fine in a web browser. You can also use styleClass inside the tag. insert styleClass="margin-riight:10px" inside the button tag