modalPanel - RichFaces - Ajax4JSF

Olá, estou tentando exibir um formulário em um modalPanel porém quando clico em submeter ele fecha as validações e mostra os erros fora do mesmo. Alguém pode me dar uma idéia de como fazer para as mensagens de erro aparecerem dentro do modal e se precisar validar o form ele não fechar o modalPanel antes que tudo ocorra corretamente?

<h:form id="form">
	<rich:modalPanel id="panel" width="600" height="800">
		<f:facet name="header">Participação em bancas de comissões julgadoras</f:facet>
		<h:messages id="erro" />
                <label for="titulo">Título:</label>
		<t:inputText forceId="true" id="titulo" required="true"
			requiredMessage="Campo Requerido"
			value="#{bancaController.banca.titulo}" />
		<a4j:commandButton value="Cadastrar"
			action="#{bancaController.action}" reRender="erro"
			onclick="javascript:Richfaces.hideModalPanel('form:panel')"
			bypassUpdates="true" />
	</rich:modalPanel>

	<rich:panel>
		<a href="#"
			onclick="javascript:Richfaces.showModalPanel('form:panel')">Adiciona</a>
	</rich:panel>
</h:form>

Sei que não devo usar o evento onclick quando for submeter o form. Qual evento devo usar para mandar fechar o modalPanel somente quando tudo for validado?

Consegui resolver o problema parcialmente, mas surgiu outro que não sei resolver. :roll: Meu template:

<?xml version="1.0" encoding="iso-8859-1"?>
<!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:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:c="http://java.sun.com/jstl/core"
	xmlns:t="http://myfaces.apache.org/tomahawk"
	xmlns:a4j="https://ajax4jsf.dev.java.net/ajax"
	xmlns:rich="http://richfaces.ajax4jsf.org/rich">
<head>
...
<link rel="shortcut icon" href="theme/default/images/favicon.ico" />
<link href="../css.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" 
src="#{facesContext.externalContext.requestContextPath}/js/valida.js"></script>
</head>
<body>
<a4j:outputPanel ajaxRendered="true">
	<h:form style="display:none" prependId="false">
		<h:inputHidden id="maximumSeverity"
			value="#{facesContext.maximumSeverity.ordinal}" />
	</h:form>
</a4j:outputPanel>
<ui:insert name="content" />
</body>
</html>

Meu código:

<?xml version="1.0" encoding="iso-8859-1"?>
<!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:c="http://java.sun.com/jstl/core"
	xmlns:t="http://myfaces.apache.org/tomahawk"
	xmlns:a4j="https://ajax4jsf.dev.java.net/ajax"
	xmlns:rich="http://richfaces.ajax4jsf.org/rich"
	template="/template.jsp">
	<ui:define name="content">
		<h:form prependId="false">
			<rich:modalPanel id="panel" width="600" height="400">
				<f:facet name="header">
					<h:outputText
						value="Participação em bancas de comissões julgadoras" />
				</f:facet>
				<f:facet name="controls">
					<h:graphicImage value="/images/modal/close.png"
						style="cursor:pointer" onclick="Richfaces.hideModalPanel('panel')" />
				</f:facet>

				<a4j:outputPanel ajaxRendered="true">
					<h:messages id="erro" />
				</a4j:outputPanel>

				<label for="natureza">Natureza:</label>
				<h:selectOneRadio required="true"
					value="#{bancaController.banca.naturezaBanca.idNaturezaBanca}"
					id="natureza">
					<f:selectItems value="#{bancaController.radio}" />
				</h:selectOneRadio>

				<label for="titulo">Título:</label>
				<h:inputText id="titulo" required="true"
					requiredMessage="Campo Requerido"
					value="#{bancaController.banca.titulo}" />

				<label for="ano">Ano:</label>
				<h:inputText id="ano" value="#{bancaController.banca.ano}" />

				<label for="pais">País:</label>
				<h:selectOneMenu id="pais"
					value="#{bancaController.banca.pais.idPais}" required="true">
					<f:selectItems value="#{bancaController.pais}" />
				</h:selectOneMenu>

				<label for="idioma">Idioma:</label>
				<h:selectOneMenu id="idioma"
					value="#{bancaController.banca.lingua.idLingua}" required="true">
					<f:selectItems value="#{bancaController.idioma}" />
				</h:selectOneMenu>

				<label for="homepage">Home Page:</label>
				<h:inputText value="#{bancaController.banca.homePage}" id="homepage" />

				<label for="instituicao">Instituição:</label>
				<h:inputText id="instituicao"
					value="#{bancaController.banca.instituicao.nome}" />

				<h:graphicImage value="/img/lupa.gif"
					onclick="javascript:Richfaces.showModalPanel('panel2')" />

				<a4j:commandButton value="Cadastrar"
					action="#{bancaController.action}" reRender="erro"
					oncomplete="windowClose('panel');" />
				<a href="javascript:Richfaces.hideModalPanel('panel');">Fechar</a>

			</rich:modalPanel>

		</h:form>
		<rich:panel>
			<a href="javascript:Richfaces.showModalPanel('panel')">Adiciona</a>
		</rich:panel>

	</ui:define>
</ui:composition>

E aqui o js:

function windowClose(panelName)
{
	if (!(document.getElementById("maximumSeverity").value == "2"))
		Richfaces.hideModalPanel(panelName);
}

O problema é o seguinte: Quando tenho algum radio ou combobox a validação falha dizendo que eles são requeridos, no entanto a valores selecionados. Se eu colocar o h:form dentro do modalPanel ocorre um erro no request quando tento submeter. Alguém sabe como devo proceder para corrigir isso?

3 Respostas

Topicos relacionados