Reuse the Primefaces Dialog - jsf

I have a Primefaces JSF view myView.xhtml with a form (with id 'myformID') and datatable (with id 'myDataTableId') in it. I also have a dialog box (myDialog.xhtml). I am including the myDialog.xhtml in myView.xhtml. When we click on the commandButton in 'myDialog.xhtml', it will update a datatable after executing the method specified in action listener. I am updating the datatable with update=":myFormId:myDataTableId"and it is working fine.
But I would like to use the same dialog in different view. The form id and datatable id are different in that view. So, how can I reuse the dialog and update datatables with different id's (currently I am creating one more dialog by duplicating the code and changed the value in the update attribute of commandButton accordingly)?

You can pass parameters with ui:include example :
master.xhtml
<ui:include src="include.xhtml">
<ui:param name="customId" value="4567" />
</ui:include>
include.xhtml
<ui:composition>
<p:dialog id="#{customId}" ...>
</p:dialog>
</ui:composition>

Related

How to hide/show a panel conditionally in primefaces/jsf2 on commandButton click?

I want to hide/show <p:panel> on commandButton click with some condition ,I tried following
<h:form>
// some tag here
<p:commandButton value="EDIT" ajax="false"
onclick="if(#{bean.status == 'ACTIVE'}){editable.show();}"
actionListener="#{beanMgnt.edit}">
</h:form>
and editable is a panel as
<p:panel widgetVar="editable" closable="true"
toggleable="true" visible="false">
// some tags here
</p:panel
edit method is doing only sysout.
What I want when enduser clicks the button this panel will be visible with bean data populated with Editable text boxes.
I want to make visible this panel visible with button click.How to do that?
You also have to use update="<id>" in your button...
so,for example, you would need <p:commandButton...update="thepanelid".../> <p:panel id="thepanelid"...
I think you could use a boolean attribute in your backing bean. In the panel you put : visible="backingbean.yourAttribute" and you use a method in your bean to control it via onclick.
onclick="backingbean.theMethod"
In the method, if your condition is verified, you can set the attribute to "true".

Cannot call action methods on RequestScoped Bean from tabView [duplicate]

does anybody know how to use RequestScoped bean together with rendered attribute in jsf? The rendered attribute is evaluated before applyValues phase and therefore is not correctly evaluated. I don't want to preserve any state. The example could be an outputPanel with a datatable and a button. The datatable gets a list of values. The wrapping outputPanel has the rendered attribute like:
<p:outputPanel rendered="#{not empty requestScopedBean.dataList}">
<p:datatable value="#{requestScopedBean.dataList}">
...
</p:datatable>
<p:commandButton action="#{requestScopedBean.someAction}" />
</p:outputPanel>
After loading the page and clicking on the button, nothing happens, because the view is restored and expressions are evaluated - the bean does have an empty datalist and therefore the panel should not be rendered. This causes that the action method is not even called - because the button doesn't exist.
If you're not interested in having a filled data table at that moment, just add an extra check in rendered attribute if the command button of interest has been invoked. You can do that by checking the presence of button's client ID in request parameter map.
<p:outputPanel rendered="#{not empty requestScopedBean.dataList or not empty param[someButton.clientId]}">
...
<p:commandButton binding="#{someButton}" ... />
</p:outputPanel>
See also:
How to let validation depend on the pressed button?

PrimeFaces dialog refer to parent

I have an xhtml page that display a Datatable with entries. I also have a button to insert a new entry, that displays a dialog that has a form. The insertion form is used as <ui:include> in the parent .xhtml as follows:
Parent file
<h:form id="mainForm">
<p:commandButton process="#form" update=":dlgGrp" oncomplete="dlg.show()"/>
<p:datatable id = "datatable">
various columns
.....
.....
</p:datatable>
</h:form>
<p:dialog widgetVar="dlg" >
<h:panelGroup id="dlgGrp">
<ui:include src="include.xhtml" />
</h:panelGroup>
</p:dialog>
</ui:composition>
Dialog file
<ui:composition xmlns . . .>
<h:form id="subForm">
various input fields
......
......
<p:commandButton process="#form" update=":mainForm" oncomplete="dlg.hide()"/>
</h:form>
</ui:composition>
How can I refer generically to a parent component as show in the file. In a few words as soon as I hit the submit button in the dialog, I want to update the main form and hide the dialog. These components however are in the "parent field".
This should probably be done programatically through the backing bean, since I do not want to include parent-specific actions in the child .xhtml, since I may aslo want to use it as a standalone .xhtml.
If you want to update the mainForm through a method in the backingBean. Just modify
<p:commandButton process="#form" action="#{backingBean.method}" oncomplete="dlg.hide()"/>
and in your backingBean do the following (see Primefaces Showcase):
public void method() {
// do something
RequestContext context = RequestContext.getCurrentInstance();
context.update(":mainForm");
}
You just need to check, if your mainForm is already in another NamingContainer.
If so, you need to change the context.update(...) accordingly.
Furthermore, if you want to update the mainForm from your backing bean, I would also recomment hiding the dialog in the backingBean, depending on the input processed. If e.g. some data is invalid, you don't want to hide the dialog. That cannot be done currently with your oncomplete action which is executed automatically after receiving the response from the server. The dialog would get close whether the input was correct or not.
So add to the method():
if (everythingWentFine) {
context.execute("dlg.hide();");
}
and remove the oncomplete from your p:commandButton.

Primefaces commandButton action attribute not being called

I am creating a JSF application with primefaces. Basically I have this view. There is a tab view which for each tab contains a command button and a accordion panel (another kind of tab view). The tabs of the accordion panel among other elements, contain each one command button. My problem is that the first command button (under 1 level of tabs) calls correctly the action method when it is clicked, while the second button (under 2 level of tabs) does not. I should say that both the tabView and accordionPanel are working correctly, since they are displaying the information they should display.
I am posting a simplified version of my view so that you can see what is happening.
<h:form>
<p:tabView id="unitTabs" orientation="left" dynamic="true" cache="false" var="unit" value="#{unitController.getUnitsOfLoggedInUser(loginController.checkedUser)}">
<p:tab id="unitTab" title="#{unit.unitName}">
<p:commandButton value="Add Lecture" action="#{unitController.setTemporary(unit)}" onclick="createLectureDialog.show()">
<p:accordionPanel id="lectureTabs" value ="#{lectureController.getLecturesForUnit(unit)}" var="lecture" dynamic="true" cache="false">
<p:tab title="#{lecture.lectureName}">
<p:commandButton value="Add Criterion" action ="#{lectureController.setTemporary(lecture)}" onclick="createCriterionDialog.show()" >
</p:tab>
</p:accordionPanel>
</p:tab>
</p:tabView>
</h:form>
What am i doing wrong? Thanks
This construct requires that the EL expression in the value attribute of the <p:tabView> and <p:accordionPanel> returns exactly the same value during processing the form submit as it was during the initial display.
If the bean is request scoped and/or the value depends behind the scenes on a request based parameter or variable and it thus returns a different value on every request, then it will fail because JSF cannot locate the button which was been invoked. To fix it, the bean needs to be placed in the view scope and the getter method should not contain any business logic, or any request based parameters or variables should be retained in the subsequent requests.
See also:
commandButton/commandLink/ajax action/listener method not invoked or input value not updated - point 4.

Why rich popupPanel component of richfaces submits null value to managed beans?

I'm using rich:popupPanel component of richfaces 4.0 & jsf 2.0 which contains some form fields like name.address & contact also one a4j:commandButton "Save". The text fields are bind to managed bean properties like
<h:inputText size="25" maxlength="20" value="#{us.patient.lname}"/>
When I click on save button then add method of button is executed which prints value of textfield (i.e properties of beans). As textfield value is not empty, the value of textfield is not bind to property of beans. It gives null result why this happen only for popup?
Do you render the <rich:popupPanel> after pressing the <a4j:commandButton> ?
For example , suppose your popupPanel has the id called popup ( <rich:popupPanel id="popup">) , you need to set the reRender attribute of the <a4j:commandButton> to defines which JSF componet you want to update as a response on Ajax interaction. In your case , you should update your <rich:popupPanel> after pressing the save <a4j:commandButton> , so you should use:
<a4j:commandButton value="Save" reRender="#{rich:clientId('popup')}" />
In <rich:popupPanel> we have to include <h:form> attribute.so when we click on button this form is submit and value are passes to beans.

Resources