<rich:tab> closes on select option in its nested form
pepelara Sep 25, 2012 12:54 AMI have a h:form inside a rich:tab of a rich:tabPanel and when I select an
option from its inside form the rich:tab closes.
Here is the structure,
home.xhtml.-
<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:rich="http://richfaces.org/rich" template="/WEB-INF/layout/template.xhtml"> <ui:define name="body"> <div id="mainDiv" style="height:595px; overflow-y: scroll; text-align: center;"> <table width="80%" align="center" style="background-color: #FFFFFF;"> <tr><td> <table width="100%" style="color: #FFFFFF; background-color: #778899;"> <tr><td align="left">Recambios de electrodoméstico</td></tr> </table> <hr width="100%" style="background-color: #778899;"/> </td></tr> <tr><td align="center"> <h:panelGrid width="100%"> <rich:tabPanel switchType="client" style="width:100%;"> <rich:tab header="Inicio"> <ui:include src="/richfaces/inicio/inicio.xhtml" /> </rich:tab> <rich:tab header="Login/Register"> <ui:include src="/richfaces/login-register/login_register.xhtml" /> </rich:tab> <rich:tab header="Catalogo"> <ui:include src="/richfaces/catalogo/catalogo.xhtml" /> </rich:tab> <rich:tab header="Carrito"> <ui:include src="/richfaces/carrito/carrito.xhtml" /> </rich:tab> <rich:tab header="Marcas"> <ui:include src="/richfaces/marcas/marcas.xhtml" /> </rich:tab> <rich:tab header="Contacta"> <ui:include src="/richfaces/contacta/contacta.xhtml" /> </rich:tab> </rich:tabPanel> </h:panelGrid> </td></tr> </table> </div> </ui:define> </ui:composition>
catalogo.xhtml.-
<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:s="http://jboss.org/seam/faces" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:rich="http://richfaces.org/rich" xmlns:c="http://java.sun.com/jsp/jstl/core"> <div id="catalogo" style="height:595px; text-align: center;"> <table width="100%" align="center" style="background-color: #FFFFFF;"> <tr><td> <table width="100%" style="color: #FFFFFF; background-color: #778899;"> <tr><td align="left">Catálogo</td></tr> </table> <hr width="100%" style="background-color: #778899;"/> </td></tr> <tr><td align="center"> <h:panelGrid rendered="#{identity.loggedIn}" width="100%"> <c:choose> <c:when test="#{currentUser.perfil == 'Admin'}"> <ui:include src="/richfaces/catalogo/admin/insertar.xhtml" /> </c:when> <c:when test="#{currentUser.perfil == 'User'}"> <ui:include src="/richfaces/catalogo/user/seleccionar.xhtml" /> </c:when> </c:choose> </h:panelGrid> <h:panelGrid rendered="#{not identity.loggedIn}"> <ui:include src="/richfaces/catalogo/otherwise/default.xhtml" /> </h:panelGrid> </td></tr> </table> </div> </ui:composition>
seleccionar.xhtml.-
<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:s="http://jboss.org/seam/faces" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:rich="http://richfaces.org/rich" xmlns:a4j="http://richfaces.org/a4j" xmlns:c="http://java.sun.com/jsp/jstl/core"> <table width="100%" align="center" style="background-color: #FFFFFF;"> <tr><td> <table width="100%" style="color: #FFFFFF; background-color: #778899;"> <tr><td align="left">Usuario Seleccionar</td></tr> </table> <hr width="100%" style="background-color: #778899;"/> </td></tr> <tr><td align="center"> <rich:tabPanel switchType="client" style="width:100%"> <rich:tab header="Lavado"> <ui:include src="/richfaces/catalogo/user/lavado/seleccionarLavado.xhtml" /> </rich:tab> <rich:tab header="Cocción"> <ui:include src="/richfaces/catalogo/user/coccion/seleccionarCoccion.xhtml" /> </rich:tab> <rich:tab header="Calor"> <ui:include src="/richfaces/catalogo/user/calor/seleccionarCalor.xhtml" /> </rich:tab> <rich:tab header="Frío"> <ui:include src="/richfaces/catalogo/user/frio/seleccionarFrio.xhtml" /> </rich:tab> </rich:tabPanel> </td></tr> </table> </ui:composition>
seleccionarLavado.xhtml.-
<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:s="http://jboss.org/seam/faces" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:rich="http://richfaces.org/rich" xmlns:a4j="http://richfaces.org/a4j" xmlns:c="http://java.sun.com/jsp/jstl/core"> <h:form id="seleccionarLavadoForm"> <table width="100%" align="center" style="background-color: #FFFFFF;"> <tr valign="middle"> <td align="center"><img src="images/catalogo/lavado.png" alt="Lavado" /></td> </tr> <tr> <td align="center"><p>Repuestos para lavadoras, lavavajillas,<br/>secadoras, lavadoras de turbina...</p></td> </tr> <tr> <td align="center"> <a4j:outputPanel> <h:panelGrid columns="2" rendered="#{familiaAgent.familia == null}"> <a4j:commandButton value="Seleccionar" render="seleccionarLavadoForm" action="#{catalogoBean.selectCategorias}" > <a4j:param name="sFamId" value="1" assignTo="#{catalogoBean.sFamId}" /> </a4j:commandButton> <a4j:commandButton value="Cancelar" render="seleccionarLavadoForm" action="#{catalogoBean.cancel}" /> </h:panelGrid> </a4j:outputPanel> <a4j:outputPanel id="panelCategorias"> <h:panelGrid rendered="#{catalogoBean.categoriasSelected and catalogoBean.showCategorias}"> <rich:dataTable id="tableCategorias" iterationStatusVar="it" var="cat" value="#{catalogoBean.categorias}"> <rich:column> <f:facet name="header">Nombre</f:facet> <h:outputText value="#{cat.nombre}" /> </rich:column> <rich:column> <f:facet name="header">Seleccionar</f:facet> <a4j:commandButton value="Seleccionar" render="seleccionarLavadoForm" action="#{catalogoBean.selectCategoria}" execute="@this"> <a4j:param name="catId" value="#{it.index}" assignTo="#{catalogoBean.catId}" /> </a4j:commandButton> </rich:column> </rich:dataTable> </h:panelGrid> </a4j:outputPanel> <a4j:outputPanel id="panelButtonMarca"> <h:panelGrid rendered="#{catalogoBean.categoriaSelected and catalogoBean.showCategorias}"> <a4j:commandButton value="Listar Marcas" render="seleccionarLavadoForm" action="#{catalogoBean.selectMarcas}" /> </h:panelGrid> </a4j:outputPanel> <a4j:outputPanel id="panelMarcas" > <h:panelGrid rendered="#{catalogoBean.marcasSelected and catalogoBean.showMarcas}"> <rich:dataTable id="tableMarcas" iterationStatusVar="it" rows="5" var="mar" value="#{catalogoBean.marcas}"> <rich:column> <f:facet name="header">Marcas</f:facet> <a4j:commandLink render="seleccionarLavadoForm" value="#{mar.nombre}" action="#{catalogoBean.selectMarca}" execute="@this"> <a4j:param name="marId" value="#{it.index}" assignTo="#{catalogoBean.marId}" /> </a4j:commandLink> </rich:column> <f:facet name="footer"> <rich:dataScroller page="#{catalogoBean.page}" /> </f:facet> </rich:dataTable> </h:panelGrid> </a4j:outputPanel> <a4j:outputPanel id="panelButtonModelo"> <h:panelGrid rendered="#{catalogoBean.marcaSelected and catalogoBean.showMarcas}"> <a4j:commandButton value="Listar Modelos" render="seleccionarLavadoForm" action="#{catalogoBean.selectModelos}" /> </h:panelGrid> </a4j:outputPanel> <a4j:outputPanel id="panelModelos"> <h:panelGrid rendered="#{catalogoBean.modelosSelected and catalogoBean.showModelos}" > <rich:dataTable iterationStatusVar="it" id="tableModelos" rows="5" var="modelo" value="#{catalogoBean.modelos}"> <rich:column> <f:facet name="header">ID</f:facet> <h:outputText value="#{it.index}" /> </rich:column> <rich:column> <f:facet name="header">Descripción</f:facet> <h:outputText value="#{modelo.descripcion}" /> </rich:column> <rich:column> <f:facet name="header">Referencia</f:facet> <a4j:commandLink value="#{modelo.modelo}" render="seleccionarLavadoForm" action="#{catalogoBean.selectModelo}" execute="@this"> <a4j:param name="modId" value="#{it.index}" assignTo="#{catalogoBean.modId}" /> </a4j:commandLink> </rich:column> <f:facet name="footer"> <rich:dataScroller page="#{catalogoBean.page1}" /> </f:facet> </rich:dataTable> </h:panelGrid> </a4j:outputPanel> <a4j:outputPanel id="panelButtonProducto"> <h:panelGrid rendered="#{catalogoBean.modeloSelected and catalogoBean.showModelos}"> <a4j:commandButton value="Listar Productos" render="seleccionarLavadoForm" action="#{catalogoBean.selectProductos}" /> </h:panelGrid> </a4j:outputPanel> <a4j:outputPanel id="panelProductos"> <h:panelGrid rendered="#{catalogoBean.productosSelected and catalogoBean.showProductos}" > <rich:dataTable iterationStatusVar="it" id="tableProductos" rows="5" var="producto" value="#{catalogoBean.productos}"> <rich:column> <f:facet name="header">Imagen</f:facet> <img src="images/productos/#{producto.imagen}" alt="Productos" /> </rich:column> <rich:column> <f:facet name="header">Descripción</f:facet> <h:outputText value="#{producto.descripcion}" /> </rich:column> <rich:column> <f:facet name="header">Existencias</f:facet> <h:outputText value="#{producto.existencias}" /> </rich:column> <rich:column> <f:facet name="header">Precio</f:facet> <h:outputText value="#{producto.precio}€" /> </rich:column> <rich:column> <f:facet name="header">Carrito</f:facet> <a4j:commandLink value="Seleccionar" render="seleccionarLavadoForm" action="#{catalogoBean.selectProducto}" execute="@this" > <a4j:param name="proId" value="#{it.index}" assignTo="#{catalogoBean.proId}"/> </a4j:commandLink> </rich:column> <f:facet name="footer"> <rich:dataScroller page="#{catalogoBean.page2}" /> </f:facet> </rich:dataTable> </h:panelGrid> </a4j:outputPanel> <a4j:outputPanel id="panelTextCantidad"> <h:panelGrid columns="2" rendered="#{catalogoBean.productoSelected and catalogoBean.showProductos}"> <h:outputText value="Cantidad:" /> <h:inputText id="inputCantidad" value="#{catalogoBean.sCantidad}" > <f:validator validatorId="customValidator"/> </h:inputText> <a4j:commandButton value="Validar Cantidad" render="seleccionarLavadoForm" action="#{catalogoBean.selectCantidad}" /> <h:message for="inputCantidad"/> </h:panelGrid> </a4j:outputPanel> <a4j:outputPanel id="panelShowData"> <h:panelGrid id="showData" columns="2" rendered="#{catalogoBean.cantidadSelected and catalogoBean.showCantidad}"> <h:outputText value="Nombre Familia:" /> <h:outputText value="#{catalogoBean.familia.nombre}" /> <h:outputText value="Nombre Categoria:" /> <h:outputText value="#{catalogoBean.categoria.nombre}" /> <h:outputText value="Marca:" /> <h:outputText value="#{catalogoBean.marca.nombre}" /> <h:outputText value="Modelo Ref.:" /> <h:outputText value="#{catalogoBean.modelo.modelo}" /> <h:outputText value="Producto Ref.:" /> <h:outputText value="#{catalogoBean.producto.referencia}" /> <h:outputText value="Cantidad:" /> <h:outputText value="#{catalogoBean.cantidad}" /> </h:panelGrid> </a4j:outputPanel> <a4j:outputPanel id="buttonCarrito"> <h:panelGrid rendered="#{catalogoBean.cantidadSelected and catalogoBean.showCantidad}"> <a4j:commandButton value="Add to Cart" render="seleccionarLavadoForm" action="#{catalogoBean.addToCarrito}" /> </h:panelGrid> </a4j:outputPanel> <a4j:outputPanel id="panelShowConfirm"> <h:panelGrid id="showConfirm" columns="1" rendered="#{catalogoBean.showConfirmarPedido}"> <h:outputText value="Para seleccionar otro producto pulse en Seleccionar," /> <h:outputText value="o bien puede confirmar el pedido y verlo en la pestaña Carrito." /> </h:panelGrid> </a4j:outputPanel> <a4j:outputPanel id="panelConfirm"> <h:panelGrid rendered="#{catalogoBean.showConfirmarPedido}"> <a4j:commandButton value="Confirmar Pedido" render="seleccionarLavadoForm" action="#{catalogoBean.confirmarPedido}" /> </h:panelGrid> </a4j:outputPanel> <a4j:outputPanel id="panelPedidoConfirmado"> <h:panelGrid id="pedidoConfirmado" rendered="#{catalogoBean.showPedidoConfirmado}"> <h:outputText value="Pedido confirmado!" /> </h:panelGrid> </a4j:outputPanel> </td> </tr> </table> </h:form> </ui:composition>
and here is where I get problems
<a4j:outputPanel id="panelCategorias"> <h:panelGrid rendered="#{catalogoBean.categoriasSelected and catalogoBean.showCategorias}"> <rich:dataTable id="tableCategorias" iterationStatusVar="it" var="cat" value="#{catalogoBean.categorias}"> <rich:column> <f:facet name="header">Nombre</f:facet> <h:outputText value="#{cat.nombre}" /> </rich:column> <rich:column> <f:facet name="header">Seleccionar</f:facet> <a4j:commandButton value="Seleccionar" render="seleccionarLavadoForm" action="#{catalogoBean.selectCategoria}" execute="@this"> <a4j:param name="catId" value="#{it.index}" assignTo="#{catalogoBean.catId}" /> </a4j:commandButton> </rich:column> </rich:dataTable> </h:panelGrid> </a4j:outputPanel>
this panel insted of gives me the selected option closes the rich:tab
I am not sure at all if I am doing it right.
Thanks in advance,
Jose