when a rich:popupPanel has one or more inner forms, the first one is ignored
A good way to overcome the form nesting limitation, when the page design allows it, is to use rich:popupPanel with domElementAttachmet="body". This way the elements in the rich:popupPanel are reparented to the page's body, avoiding any form that were wrapping the <rich:popup> tag. Unfortunately, there is a bug whose effect is to ignore the first popupPanel's inner form tag. The first form tag is not rendered but its children remain. To avoid this issue is very simple: Insert an empty form tag before the first form.
The code below reproduces the error:
(RichRaces v4.2.0 and JBoss AS v7.1.1 runtime)
{code:xml}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head></h:head>
<h:body>
<h:form>
<h:inputText id="itOne" value="#{mb.propertyOne}" />
<h:inputText id="itTwo" value="#{mb.propertyTwo}" />
<h:inputText id="itThree" value="#{mb.propertyThree}" />
<h:commandButton value="commit all" />
<br />
<h:button value="open"
onclick="#{rich:component('popup')}.show();return false;" />
<rich:popupPanel id="popup" modal="true" domElementAttachment="body"
autosized="true" moveable="true">
<f:facet name="header">Drag handle</f:facet>
<f:facet name="controls">
<h:button value="X" onclick="#{rich:component('popup')}.hide();" />
</f:facet>
<h:form/> <!-- WORK ARROUND: because the bug effect is to ignore the first form, this emtpy form is sacrificed to safe the next -->
<h:form>Form One
<h:inputText value="#{mb.propertyOne}" />
<a4j:commandButton value="commit form one" render="itOne" />
</h:form>
<br />
<h:form>Form Two
<h:inputText value="#{mb.propertyTwo}" />
<a4j:commandButton value="commit form two" render="itTwo" />
</h:form>
<br />
<h:form>Form Three
<h:inputText value="#{mb.propertyThree}" />
<a4j:commandButton value="commit form three" render="itThree" />
</h:form>
<br />
<h:button value="close" onclick="#{rich:component('popup')}.hide();" />
</rich:popupPanel>
</h:form>
</h:body>
</html>
{code}
Backing bean
{code}
package com.intelap.pruebas.prototipoCambTec.facades;
import java.io.Serializable;
import javax.enterprise.context.SessionScoped;
import javax.inject.Named;
@Named("mb")
@SessionScoped
public class TestPopupMB implements Serializable {
private String propertyOne;
private String propertyTwo;
private String propertyThree;
public String getPropertyOne() {
return propertyOne;
}
public void setPropertyOne(String propertyOne) {
this.propertyOne = propertyOne;
}
public String getPropertyTwo() {
return propertyTwo;
}
public void setPropertyTwo(String propertyTwo) {
this.propertyTwo = propertyTwo;
}
public String getPropertyThree() {
return propertyThree;
}
public void setPropertyThree(String propertyThree) {
this.propertyThree = propertyThree;
}
}
{code}