I am not able to update both the output panels after the ajax call of a method in the backing bean.
Code looks like below given sample code
abc.xhtml
<p:outputPanel id="criteriaPanel" rendered="#{myBean.showPanel}">
<h:form id="loginForm">
<ui:include src="login.xhtml" />
<p:commandButton action="#{myBean.login}" value="Login" update="criteriaPanel successPanel" />
</h:form>
</p:outputPanel>
<p:outputPanel id="successPanel" rendered="#{!myBean.showPanel}">
<h:form id="successForm">
<ui:include src="success.xhtml" />
</h:form>
</p:outputPanel>
MyBean.java
public class MyBean {
private boolean showPanel = true;
public void login() {
this.setShowPanel(false);
}
public void setShowPanel(boolean showPanel) {
this.showPanel = showPanel;
}
public boolean isShowPanel() {
return showPanel;
}
}
Related
I disabled <p:poll> by default with autoStart="false" .
Now i have a dialog opened by commandButton with this example code :
<h:body>
<h:form>
<p:commandButton value="Open Dialog" oncomplete="PF('sampleDialog').show();PF('w_poll').start();"/>
<p:dialog header="Sample Dialog" height="300" width="400" widgetVar="sampleDialog" resizable="false" onHide="PF('w_poll').stop();">
<p:accordionPanel>
<p:ajax event="tabChange" oncomplete="PF('w_poll').start();"/>
<p:tab title="First">
<h:panelGroup id="firstGroup">
<p:poll interval="1"
id="firstPoll"
widgetVar="w_poll"
update="firstLabel"
async="true"
autoStart="false"
global="false"
listener="#{firstCounter.init}"/>
<p:outputLabel value="#{firstCounter.number}" id="firstLabel"/>
</h:panelGroup>
</p:tab>
<p:tab title="Second">
<h:panelGroup id="secondGroup">
<p:poll interval="3"
id="secondPoll"
widgetVar="w_poll"
update="secondLabel"
async="true"
autoStart="false"
global="false"
listener="#{secondCounter.init}"/>
<p:outputLabel value="#{secondCounter.number}" id="secondLabel"/>
</h:panelGroup>
</p:tab>
<p:tab title="Third">
<h:panelGroup id="thirdGroup">
<p:poll interval="5"
id="thirdPoll"
widgetVar="w_poll"
update="thirdLabel"
async="true"
autoStart="false"
global="false"
listener="#{thirdCounter.init}"/>
<p:outputLabel value="#{thirdCounter.number}" id="thirdLabel"/>
</h:panelGroup>
</p:tab>
</p:accordionPanel>
</p:dialog>
</h:form>
</h:body>
Note : you can see poll started on dialog show and stopped on hide .
this is my beans :
public abstract class AbstractBean implements Serializable {
private int number;
public void counter(int sleepTime) {
sleep(sleepTime);
this.number = number + 1;
}
public int getNumber() {
return number;
}
private static void sleep(int time) {
try {
Thread.sleep(time);
} catch (InterruptedException e) {
e.printStackTrace();
}
}
}
now implement three bean with this abstract :
#Named
#ViewScoped
public class FirstCounter extends AbstractBean {
#PostConstruct
public void init() {
counter(1000);
}
}
and another :
#Named
#ViewScoped
public class SecondCounter extends AbstractBean {
#PostConstruct
public void init() {
counter(3000);
}
}
and another :
#Named
#ViewScoped
public class ThirdCounter extends AbstractBean {
#PostConstruct
public void init() {
counter(5000);
}
}
I have two problem :
1) first tab of accordion panel not started counter after dialog opened .
2) change tab event not work . i want to start counter of this same tab .
I am developing a project with Primefaces 5.1.
In my project, I used p:idleMonitor, on my Start button click the p:idleMonitor rendered="true" is working .
On my Stop button click the p:idleMonitor rendered="false" not working and the p:idleMonitor is still processing.
Sample Code:
index.xhtml
<p:panel id="mainPanelId">
<p:commandButton value="Start" update="mainPanelId" action="{Sample.start}"/>
<p:commandButton value="Stop" update="mainPanelId" action="#{Sample.stop}"/>
<p:idleMonitor timeout="5000" rendered="#{Sample.idleRendered}">
<p:ajax event="idle" oncomplete="PF('dialogId').show();"/>
<p:ajax event="active" oncomplete="PF('dialogId').hide();"/>
</p:idleMonitor>
<p:dialog id="dialogId" widgetVar="dialogId" header="Idle">
<p:outputLabel value="Idle Mode Actived!"/>
</p:dialog>
</p:panel>
Sample.java
class Sample
{
private boolean idleRendered;
public String start()
{
idleRendered = true;
return null;
}
public String stop()
{
idleRendered = false;
return null;
}
}
A few things you should do differently.
Use <h:form>
Use actionListener by p:commandButton and void methods of your bean
XHTML
<h:form>
<p:panel id="mainPanelId">
<p:commandButton value="Start" update="mainPanelId"
actionListener="#{Sample.start}" />
<p:commandButton value="Stop" update="mainPanelId"
actionListener="#{Sample.stop}" />
<h:outputText value="#{Sample.idleRendered}" />
<p:idleMonitor timeout="5000" rendered="#{Sample.idleRendered}">
<p:ajax event="idle" oncomplete="PF('dialogId').show();" />
<p:ajax event="active" oncomplete="PF('dialogId').hide();" />
</p:idleMonitor>
<p:dialog id="dialogId" widgetVar="dialogId" header="Idle">
<p:outputLabel value="Idle Mode Actived!" />
</p:dialog>
</p:panel>
</h:form>
Bean
#Named("Sample")
#SessionScoped
public class Sample implements Serializable {
private boolean idleRendered = true;
public void start() {
idleRendered = true;
}
public void stop() {
idleRendered = false;
}
public boolean isIdleRendered() {
return idleRendered;
}
public void setIdleRendered(boolean idleRendered) {
this.idleRendered = idleRendered;
}
}
Update:
Looks like a bug, here is a workaround:
<p:outputPanel rendered="#{Sample.idleRendered}">
<p:idleMonitor timeout="5000">
<p:ajax event="idle" oncomplete="PF('dialogId').show();" />
<p:ajax event="active" oncomplete="PF('dialogId').hide();" />
</p:idleMonitor>
</p:outputPanel>
I have a p:inputTextarea and I need the value of it while processing the form. It turned out that every time I submit the form I get all the values except the one from the textarea. #{xyzUI.description} is a String object with regular getters and setters.
<ui:composition>
<h:form id="form1">
<p:panel rendered="...">
<p:panel id="formPanel">
<p:panelGrid columns="2" cellpadding="5">
<!-- other form elements -->
<p:outputLabel>Description:</p:outputLabel>
<p:inputTextarea value="#{xyzUI.description}" style="width: 350px;" counter="display" counterTemplate="{0} characters remaining" maxlength="2000" autoResize="true" rows="4" />
<h:panelGroup />
<h:outputText id="display" />
</p:panelGrid>
<p:commandButton rendered="#{not xyzUI.noChange}" action="#{xyzUI.submitForm}" update="formPanel" ajax="true" value="Apply" >
<p:ajax update="formPanel"></p:ajax>
</p:commandButton>
</p:panel>
</p:panel>
</h:form>
<ui:composition>
In my backing bean the value is always "". I don't know what's wrong.
public void submitForm()
{
...
tmp.setDescription(description); // String is always "" while debugging
myList.add(tmp);
RequestContext.getCurrentInstance().update("content");
}
I ran your code locally and discovered the issue. In the command button, remove the p:ajax call.
PrimeFaces command buttons are ajax enabled by default.
So change this:
<p:commandButton rendered="#{not xyzUI.noChange}" action="#{xyzUI.submitForm}" update="formPanel" ajax="true" value="Apply" >
<p:ajax update="formPanel"></p:ajax>
</p:commandButton>
To this:
<p:commandButton rendered="#{not xyzUI.noChange}" action="#{xyzUI.submitForm}" update="formPanel" value="Apply" />
My backing bean for reference
#ManagedBean
#ViewScoped
public class xyzUI implements Serializable{
private static final long serialVersionUID = 6259024062406526022L;
private String description;
private boolean noChange = false;
public xyzUI(){
}
public void submitForm(){
System.out.println(description);
}
public boolean isNoChange() {
return noChange;
}
public void setNoChange(boolean noChange) {
this.noChange = noChange;
}
public String getDescription() {
return description;
}
public void setDescription(String description) {
this.description = description;
}
}
How can dynamically show or hide a panel ?
With the given example below, when I click btn-1 then panel-2 shows and panel-1 hides. But when I click btn-2 nothing happens.
ManagedBean
#ManagedBean
#ViewScoped
public class SampleController implements Serializable {
private Boolean showPanel;
public void button1() {
showPanel = Boolean.FALSE;
}
public void button2() {
showPanel = Boolean.TRUE;
}
public Boolean showPanel1(){
return showPanel;
}
public Boolean showPanel2(){
return ! showPanel;
}
}
XHTML
<h:form id="form">
<h:panelGroup id="container-panel-1">
<h:panelGroup id="panel-1" rendered="#{sampleController.showPanel1()}">
<p:commandButton id="btn-1"
actionListener="#{sampleController.button1}"
update=":form:container-panel-1, :form:container-panel-2" />
</h:panelGroup>
</h:panelGroup>
<h:panelGroup id="container-panel-2">
<h:panelGroup id="panel-2" rendered="#{sampleController.showPanel2()}">
<p:commandButton id="btn-2"
actionListener="#{sampleController.button2}"
update=":form:container-panel-1, :form:container-panel-2" />
</h:panelGroup>
</h:panelGroup>
</h:form>
I hope you can help me with this.
Thank you,
Bell
This code is works:
View:
<h:form id="form">
<h:panelGroup id="container-panel-1">
<h:panelGroup id="panel-1" rendered="#{sampleController.showPanel1()}">
<p:commandButton id="btn-1" value="btn1"
actionListener="#{sampleController.button1}"
update=":form:container-panel-1, :form:container-panel-2" />
</h:panelGroup>
</h:panelGroup>
<h:panelGroup id="container-panel-2">
<h:panelGroup id="panel-2" rendered="#{sampleController.showPanel2()}">
<p:commandButton id="btn-2" value="btn2"
actionListener="#{sampleController.button2}"
update=":form:container-panel-1, :form:container-panel-2" />
</h:panelGroup>
</h:panelGroup>
</h:form>
Bean:
import java.io.Serializable;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
#ManagedBean
#ViewScoped
public class SampleController implements Serializable {
private boolean showPanel;
public void button1() {
showPanel = false;
}
public void button2() {
showPanel = true;
}
public boolean showPanel1(){
return showPanel;
}
public boolean showPanel2(){
return ! showPanel;
}
}
I am lost. I researched almost every post about setPropertyListener and I do not know what I'm doing wrong. I have this JSF Page:
<ui:define name="content">
<h:form id="itemSearchForm">
<p:commandButton update=":itemForm"
icon="ui-icon ui-icon-search">
<f:setPropertyActionListener target="#{itemDetailManagedBean.itemId}"
value="test"/>
<f:setPropertyActionListener target="#{itemDetailManagedBean.accountType}"
value="test"/>
</p:commandButton>
<p:dataTable id="itemList"
paginator="true"
var="currentItem"
value="#searchItemManagedBean.searchItems}">
.
.
<p:column headerText="Detail">
<p:commandButton update=":itemForm"
oncomplete="PF('itemDetail').show()"
icon="ui-icon ui-icon-search">
<f:setPropertyActionListener target="#{itemDetailManagedBean.itemId}"
value="test"/>
<f:setPropertyActionListener target="#{itemDetailManagedBean.accountType}"
value="test"/>
</p:commandButton>
</p:column>
</p:dataTable>
</h:form>
</ui:define>
and itemDetailManagedean:
public class ItemDetailManagedBean implements Serializable{
private String itemId,accountType;
public ItemDetailManagedBean() {
}
public SearchForItemBean getSearchBean() {
return searchBean;
}
public String getItemId() {
return itemId;
}
public String getAccountType() {
return accountType;
}
public void setItemId(String itemId) {
this.itemId = itemId;
}
public void setAccountType(String accountType) {
this.accountType = accountType;
}
}
The problem is, that the first commandButton is working as it should(so it set the properties right). But the second commandButton does not work at all. Both button shows dialog, as they should. I have itemForm on the other part of page.
Got the sollution finally. The problem was actually not in the JSF but in ServiceBean, which had changed the data table content during the loading.