Modal Panel Controls
I have the following codeset -
BeanView.java:
/**
*
*/
package com.emt.view;
public class BeanView {
private String cancelStatus;
public BeanView() {
reset();
}
public void reset() {
setCancelStatus("NOT CANCELLED");
}
public void cancelButtonAction() {
System.out.println("ACTION CANCELLED");
setCancelStatus("CANCELLED");
}
/**
* @return the cancelStatus
*/
public String getCancelStatus() {
return cancelStatus;
}
/**
* @param cancelStatus the cancelStatus to set
*/
public void setCancelStatus(String cancelStatus) {
this.cancelStatus = cancelStatus;
}
}home.xhtml:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:rich="http://richfaces.org/rich"
xmlns:a4j="http://richfaces.org/a4j">
<h:panelGrid columns="1" id="pg">
<a4j:commandButton value="SHOW" action="#{beanView.reset}" onclick="Richfaces.showModalPanel('mp');" reRender="pg" />
<rich:spacer height="20px"/>
<h:outputText value="CANCEL STATUS = #{beanView.cancelStatus}"/>
</h:panelGrid>
<rich:modalPanel id="mp" width="1000" height="400" moveable="false" resizeable="false" shadowDepth="8" top="auto" left="auto">
<a4j:keepAlive beanName="beanView"/>
<f:facet name="header">
<h:form id="form1">
<h:outputText value="Header Sect - " style="color: white; font-size:14pt;"/>
<a4j:commandButton value="A (Y)" action="#{beanView.cancelButtonAction}" reRender="pg" />
<a4j:commandButton value="B (N)" action="#{beanView.cancelButtonAction}" onclick="Richfaces.hideModalPanel('mp'); return false;" reRender="pg" />
</h:form>
</f:facet>
<h:panelGrid columns="1" border="0" width="100%">
<a4j:outputPanel id="content">
<h:form id="form2">
<h:panelGrid columns="1">
<h:outputText value="A = CANCEL ONLY"/>
<h:outputText value="B = CANCEL AND CLOSE"/>
</h:panelGrid>
<h:panelGrid columns="3">
<a4j:commandButton value="A (Y)" action="#{beanView.cancelButtonAction}" reRender="pg" />
<a4j:commandButton value="B (N)" action="#{beanView.cancelButtonAction}" onclick="Richfaces.hideModalPanel('mp'); return false;" reRender="pg" />
</h:panelGrid>
<h:panelGrid columns="1">
<a4j:commandButton value="RESET" action="#{beanView.reset}" reRender="pg" />
</h:panelGrid>
</h:form>
</a4j:outputPanel>
</h:panelGrid>
</rich:modalPanel>
</ui:composition>I've noticed that when the controls are placed in the header facet or even the body section of the modal panel, the commandButton with an ajax post to BeanView.cancelButtonAction() works...
<f:facet name="header">
<h:form id="form1">
<h:outputText value="Header Sect - " style="color: white; font-size:14pt;"/>
<a4j:commandButton value="A (Y)" action="#{beanView.cancelButtonAction}" reRender="pg" />
<a4j:commandButton value="B (N)" action="#{beanView.cancelButtonAction}" onclick="Richfaces.hideModalPanel('mp'); return false;" reRender="pg" />
</h:form>
</f:facet>
... however, when the buttons are in the controls facet it doesn't work.
<f:facet name="controls">
<h:form id="form1">
<h:outputText value="Controls Sect - " style="color: white; font-size:14pt;"/>
<a4j:commandButton value="A (N)" action="#{beanView.cancelButtonAction}" reRender="pg" />
<a4j:commandButton value="B (N)" action="#{beanView.cancelButtonAction}" onclick="Richfaces.hideModalPanel('mp'); return false;" reRender="pg" />
</h:form>
</f:facet>
Even more, I can't get it to work with an onclick action to hide the modal panel.
action="#{beanView.cancelButtonAction}" onclick="Richfaces.hideModalPanel('mp'); return false;"
On the header facet, button A posts to the bean but not button B. Neither buttons post to the bean on the controls facet. Within the body of the modal panel, I've added the same buttons and only button A posts to the bean.
After researching the issue I saw a similar post in this forum that suggested that the form would evaluate the onclick before the action was implemented, so I placed a return false in the onclick, but it still didn't post. I'm trying a couple other things in the meantime, but would entertain any suggestions that may help.
PROBLEM: Is there a way to click on a control in a modal panel to both close the modal panel and asynchronously post back to a cancel method inside the view bean to update data on the main screen?
Any help would be greatly appreciated. Thanks.
