Ao clicar no botão o modal aparece, mas fecha imediatamente, alguém tem uma ideia de como posso resolver isso?
Dúvida rich:modalpanel
5 Respostas
Marcio, você deve estar dando reRender no id do modal, normalmente é o que acarreta esse problema. Você tem que dar reRender somente em um painel dentro do modal, para que ele atualize os dados do modal, mas nunca no id do modal. Verifica isso, e se caso não for isso post o código da chamada ao modal aí pra gente dar uma olhada.
[]´s
De fato, estou utilizando o id do modalpanel para exibi-lo, talvez haja uma forma de resolver este problema, mas no momento não me vem nada em mente. Uma pergunta meio besta: será que se eu remover o atributo id do modal resolve?
Marcio, como eu te falei, você tem que dar o reRender em um painel dentro do modal, como abaixo:
<rich:modalPanel id="modalExemplo" moveable="true" style="width: auto;" resizeable="false" styleClass="modalHeader avisos">
<f:facet name="header">
<span style="position: relative; margin-left: 5px; top: 5px;">
Exemplo
</span>
</f:facet>
<h:form>
<a4j:outputPanel id="painelModalExemplo">
Conteúdo do modal!!!
</a4j:outputPanel>
</h:form>
</rich:modalPanel>
No botão que você fizer a chamada pro modal, irá dar reRender no id do painel, “painelModalExemplo” e não no “modalExemplo”. Assim você abrirá o painel e ele vai permanecer aberto até você fecha-lo. Esse reRender é necessário para você atualizar os dados desse painel, porque o próprio comando para chamar o modal já o mostra na tela:
javascript:Richfaces.showModalPanel('modalExemplo');
Isso já abre o modal e exibe na tela, não é necessário reRender. Repare que para a chamada do modal você precisa do id dele, então não pode retirá-lo. Mas se precisar atualizar os dados do modal daí sim é preciso o reRender no painel.
[]´s
Vou postar meu código para ver se você me ajuda a ver o erro.
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib prefix="f" uri="http://java.sun.com/jsf/core"%>
<%@taglib prefix="h" uri="http://java.sun.com/jsf/html"%>
<%@taglib prefix="rich" uri="http://richfaces.org/rich"%>
<%@taglib prefix="a4j" uri="http://richfaces.org/a4j"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%--
This file is an entry point for JavaServer Faces application.
--%>
<f:view>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>JSP Page</title>
</head>
<body>
<h:form>
<f:verbatim><div align="center"></f:verbatim>
<!--aqui começa o panel-->
<rich:panel style="width:236px;">
<f:facet name="header">
<h:outputText value="Tela de Login"/>
</f:facet>
<h:panelGrid columns="2">
<h:panelGroup>
<h:outputLabel id="lblLogin" for="txtLogin" value="Usuário:"/>
</h:panelGroup>
<h:panelGroup>
<h:inputText id="txtLogin" required="true">
<f:validateLength minimum="8"/>
</h:inputText>
</h:panelGroup>
<h:panelGroup>
<h:outputLabel id="lblSenha" for="txtSenha" value="Senha:"/>
</h:panelGroup>
<h:panelGroup>
<h:inputSecret id="txtSenha" required="true">
<f:validateLength minimum="8"/>
</h:inputSecret>
</h:panelGroup>
</h:panelGrid>
<h:panelGrid columns="1">
<f:facet name="footer">
<h:commandButton id="cmdLogin" value="Efetuar Login">
<rich:componentControl for="panel" attachTo="cmdLogin" operation="show" event="onclick"/>
</h:commandButton>
</f:facet>
</h:panelGrid>
</rich:panel>
<!--aqui termina o panel-->
<f:verbatim></div></f:verbatim>
<!--aqui começa o modal panel-->
<f:subview id="modal">
<rich:modalPanel id="panel" width="360">
<f:facet name="header">
<h:panelGroup>
<h:outputText value="Alerta"/>
</h:panelGroup>
</f:facet>
<f:facet name="controls">
<h:panelGroup>
<h:graphicImage value="/img/close.png" styleClass="hidelink" id="hidelink"/>
<rich:componentControl for="panel" attachTo="hidelink" operation="hide" event="onclick"/>
</h:panelGroup>
</f:facet>
<!--aqui começa o message-->
<a4j:outputPanel id="mensagens" rendered="true">
<rich:message for="txtLogin">
<f:facet name="ok">
<h:graphicImage value="/img/passed.gif"/>
</f:facet>
<f:facet name="erro">
<h:graphicImage value="/img/error.gif"/>
</f:facet>
</rich:message>
<f:verbatim><br></f:verbatim>
<rich:message for="txtSenha">
<f:facet name="ok">
<h:graphicImage value="/img/passed.gif"/>
</f:facet>
<f:facet name="erro">
<h:graphicImage value="/img/error.gif"/>
</f:facet>
</rich:message>
</a4j:outputPanel>
<!--aqui termina o message-->
</rich:modalPanel>
</f:subview>
<!--aqui termina o modal panel-->
</h:form>
</body>
</html>
</f:view>
Cara, pelo visto ta quase tudo certo… você só precisa deixar o form da página separado do modal para funcionar. Você fecha o form da página antes de começar o modal, e cria um forma dentro do modal para o painel dele. seu código ficaria assim:
<body>
<h:form>
<f:verbatim><div align="center"></f:verbatim>
<!--aqui começa o panel-->
<rich:panel style="width:236px;">
<f:facet name="header">
<h:outputText value="Tela de Login"/>
</f:facet>
<h:panelGrid columns="2">
<h:panelGroup>
<h:outputLabel id="lblLogin" for="txtLogin" value="Usuário:"/>
</h:panelGroup>
<h:panelGroup>
<h:inputText id="txtLogin" required="true">
<f:validateLength minimum="8"/>
</h:inputText>
</h:panelGroup>
<h:panelGroup>
<h:outputLabel id="lblSenha" for="txtSenha" value="Senha:"/>
</h:panelGroup>
<h:panelGroup>
<h:inputSecret id="txtSenha" required="true">
<f:validateLength minimum="8"/>
</h:inputSecret>
</h:panelGroup>
</h:panelGrid>
<h:panelGrid columns="1">
<f:facet name="footer">
<h:commandButton id="cmdLogin" value="Efetuar Login">
<rich:componentControl for="panel" attachTo="cmdLogin" operation="show" event="onclick"/>
</h:commandButton>
</f:facet>
</h:panelGrid>
</rich:panel>
<!--aqui termina o panel-->
<f:verbatim></div></f:verbatim>
<!-- aqui você vai fechar o form da página -->
</h:form>
<!--aqui começa o modal panel-->
<f:subview id="modal">
<rich:modalPanel id="panel" width="360">
<f:facet name="header">
<h:panelGroup>
<h:outputText value="Alerta"/>
</h:panelGroup>
</f:facet>
<f:facet name="controls">
<h:panelGroup>
<h:graphicImage value="/img/close.png" styleClass="hidelink" id="hidelink"/>
<rich:componentControl for="panel" attachTo="hidelink" operation="hide" event="onclick"/>
</h:panelGroup>
</f:facet>
<!--aqui começa o message-->
<!-- aqui você vai abrir um form para o modal -->
<h:form>
<a4j:outputPanel id="mensagens" rendered="true">
<rich:message for="txtLogin">
<f:facet name="ok">
<h:graphicImage value="/img/passed.gif"/>
</f:facet>
<f:facet name="erro">
<h:graphicImage value="/img/error.gif"/>
</f:facet>
</rich:message>
<f:verbatim><br></f:verbatim>
<rich:message for="txtSenha">
<f:facet name="ok">
<h:graphicImage value="/img/passed.gif"/>
</f:facet>
<f:facet name="erro">
<h:graphicImage value="/img/error.gif"/>
</f:facet>
</rich:message>
</a4j:outputPanel>
</h:form>
<!-- aqui você vai fechar form do modal -->
<!--aqui termina o message-->
</rich:modalPanel>
</f:subview>
<!--aqui termina o modal panel-->
</body>
[]´s