ajax4jsf duvidas para renderizar areas na tela

Tenho o seguinte cenario:
pessoa Fisica e Juridica,ao selecionar um dos tipos em um <h:selectOneRadio …/> deve ser renderizada os
<a4j:outputPanel …/> referentes ao tipo selecionado,este processo deve passar sem que seja validado os campos requeridos,vejam minha dificuldade abaixo:

&lt;center&gt;&lt;h:outputText value="#{msg.tipopessoa}"&gt;&lt;/h:outputText&gt;
								 &lt;h:selectOneRadio
									value="#{cliente.cliente.tipopessoa}"&gt;
									&lt;a4j:support event="onclick" action="#{cliente.mudaPessoa}"
										reRender="pf,pj,r" ajaxSingle="true"&gt;&lt;/a4j:support&gt;
									&lt;f:selectItem itemLabel="#{msg.pessoafisica}" id="chpf"
										itemValue="true" itemDisabled="#{cliente.clienteEditando}" /&gt;

									&lt;f:selectItem itemLabel="#{msg.pessoajuridica}" id="chpj"
										itemValue="false" itemDisabled="#{cliente.clienteEditando}" /&gt;
								&lt;/h:selectOneRadio&gt;&lt;/center&gt;

aqui os paineis que serão renderizados conforme a opcao do usuario:

&lt;a4j:outputPanel ajaxRendered="true" id="pf"
									rendered="#{cliente.cliente.tipopessoa}"&gt;

									&lt;h:panelGrid columns="2" width="730"&gt;
										&lt;h:panelGroup&gt;
											&lt;h:outputText value="#{msg.nome}"&gt;&lt;/h:outputText&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
										&lt;rich:spacer width="13"&gt;&lt;/rich:spacer&gt;

											&lt;h:inputText value="#{cliente.pessoafisica.nome}" id="nome"
												required="true" style=" width : 507px;" styleClass="select"
												maxlength="40"&gt;
											&lt;/h:inputText&gt;
											&lt;h:graphicImage value="/images/stop.png" width="15"
												height="15" styleClass="imagem"&gt;
											&lt;/h:graphicImage&gt;
										&lt;/h:panelGroup&gt;
										<br>
										&lt;h:panelGroup&gt;
											&lt;h:outputText value="#{msg.cpf}"&gt;&lt;/h:outputText&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
										&lt;rich:spacer width="13"&gt;&lt;/rich:spacer&gt;
											&lt;h:panelGroup&gt;
												&lt;h:inputText value="#{cliente.pessoafisica.cpf}"
													onkeypress="mascara(this,soNumeros)" maxlength="11"
													style=" width : 123px;" id="icpf" onblur=" VerificaCPF ();"
													required="#{cliente.cliente.tipopessoa}"
													disabled="#{cliente.clienteEditando}"&gt;

												&lt;/h:inputText&gt;
												&lt;h:graphicImage value="/images/stop.png" width="15"
													height="15" styleClass="imagem"&gt;
												&lt;/h:graphicImage&gt;
											&lt;/h:panelGroup&gt;  
										&nbsp;
										
										 &lt;h:outputText value="#{msg.rg}"&gt;&lt;/h:outputText&gt;
											&lt;rich:spacer width="11"&gt;&lt;/rich:spacer&gt;
											&lt;h:panelGroup&gt;
												&lt;h:inputText value="#{cliente.pessoafisica.rg}"
													onkeypress="mascara(this,soNumeros)" styleClass="select"
													style=" width : 109px;" id="rg"
													required="#{cliente.cliente.tipopessoa}"
													disabled="#{cliente.clienteEditando}"&gt;
												&lt;/h:inputText&gt;
												&lt;h:graphicImage value="/images/stop.png" width="15"
													height="15" styleClass="imagem"&gt;
												&lt;/h:graphicImage&gt;
											&lt;/h:panelGroup&gt;


										&lt;/h:panelGroup&gt;
									&lt;/h:panelGrid&gt;
								&lt;/a4j:outputPanel&gt;




&lt;a4j:outputPanel id="pj"
									rendered="#{not cliente.cliente.tipopessoa}"&gt;
									&lt;h:panelGrid columns="3" width="712"&gt;
										&lt;h:panelGroup&gt;
											&lt;h:outputText value="#{msg.nomefantasia}"&gt;&lt;/h:outputText&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
											&lt;rich:spacer width="8"&gt;&lt;/rich:spacer&gt;
											&lt;h:inputText value="#{cliente.pessoajuridica.nomefantasia}"
												style=" width : 319px;" id="nf" maxlength="40"
												required="#{!cliente.cliente.tipopessoa}"
												styleClass="select" label="#{msg.nomefantasia}"&gt;
											&lt;/h:inputText&gt;
											&lt;h:graphicImage value="/images/stop.png" width="15"
												height="15" styleClass="imagem"&gt;
											&lt;/h:graphicImage&gt;
										&lt;/h:panelGroup&gt;
										&lt;h:panelGroup&gt;
											&lt;h:outputText value="#{msg.cnpj}"&gt;&lt;/h:outputText&gt;
											&lt;rich:spacer width="20"&gt;&lt;/rich:spacer&gt;
											&lt;h:inputText value="#{cliente.pessoajuridica.cnpj}"
												id="icnpj" onkeypress="mascara(this,soNumeros)"
												maxlength="18" required="#{!cliente.cliente.tipopessoa}"
												style=" width : 190px;" label="#{msg.cnpj}"
												onblur="return validaCNPJ()"
												disabled="#{cliente.clienteEditando}"&gt;
											&lt;/h:inputText&gt;
											&lt;h:graphicImage value="/images/stop.png" width="15"
												height="15" styleClass="imagem"&gt;
											&lt;/h:graphicImage&gt;
										&lt;/h:panelGroup&gt;
									&lt;/h:panelGrid&gt;

								&lt;/a4j:outputPanel&gt;







&lt;a4j:outputPanel id="r"
									rendered="#{not cliente.cliente.tipopessoa}"&gt;
									&lt;h:panelGrid columns="3" width="737"&gt;
										&lt;h:outputText value="#{msg.ramo}"&gt;&lt;/h:outputText&gt;
										&lt;rich:spacer width="0"&gt;&lt;/rich:spacer&gt;
										&lt;h:panelGroup&gt;
											&lt;h:inputText value="#{cliente.ramoatividade.descricao}"
												id="ramo" maxlength="40" styleClass="select"
												required="#{not cliente.cliente.tipopessoa}"
												style=" width : 318px;"&gt;&lt;/h:inputText&gt;
											&lt;h:graphicImage value="/images/stop.png" width="15"
												height="15" styleClass="imagem"&gt;
											&lt;/h:graphicImage&gt;
										&lt;/h:panelGroup&gt;
									&lt;/h:panelGrid&gt;
								&lt;/a4j:outputPanel&gt;

Se alguem puder ajudar fico mto grato,pois ja pesquisei e tentei implementar isso de varias maneiras mas nao obtive exito ainda :frowning: .
Obrigado,abracos.

Qual a dificuldade? Onde está o código?

Opa, tá complicado ver o código aqui, está dando problemas com o Firefox, putz…

Aqui tava dando pau no topico tbm,agora to usando o opera e ta blz

Olhando teu código vi que você colocou o rendered="#{cliente.cliente.tipopessoa}" no a4j:outputPanel, o que é um problema. A idéia do a4j:outputPanel é ser o container que será atualizado (reRender), e não escondido.

Pois quando você some com ele, rendered=“false”, e tenta reRenderiza-lo o framework javascripd do Ajax4jsf não consigará acha-lo na árvore DOM, pois ele não existe lá.

O que você pode fazer é usar o rendered="#{cliente.cliente.tipopessoa}" no h:panelGrid dentro do a4j:outputPanel.

Cara vc é um mostro do java e jsf mesmo,mto obrigado funcionou certinho,agora me diga uma coisa que tenho duvida um modal panel deve estar dentro de um form separado ou dentro dele deve ter um form para os componentes?Pode um modal Panel ficar dentro do mesmo form do resto da pagina?

  • uma vez mto obrigado,abraços.

Sim, é possível sim que ele esteja dentro do mesmo form da página principal. Porém há casos em que é necessário que ele esteja fora e esteja dentro de outro form.

chegamos no ponto que eu queria,qdo devo coloca-lo separado e qdo nao?

Isso depende da necessidade. Se teu modalpanel for um formulário de pesquisa, no estilo de um LOV, provavelmente ele será um formulário a parte, ou no minino um sub-form.

Enfim, vai depender do caso. Não existe uma regra geral para isso. É algo semelhante a trabalha com abas, em certos cenários as abas fazem parte de um formulário maior, noutras cada aba será um formulário independente.

Deu para entender?

blz entendi sim,mto obrigado pelas dicas. :smiley:

A solução do problema me fez economizar algumas horas de testes. Obrigado por compartlhar o conhecimento…

[quote=rponte]Isso depende da necessidade. Se teu modalpanel for um formulário de pesquisa, no estilo de um LOV, provavelmente ele será um formulário a parte, ou no minino um sub-form.
…[/quote]

Rafael, como faço para utilizar um sub-form? Na verdade o meu problema é o seguinte:

Tenho uma página de cadastro com seu form. Em uma parte do cadastro preciso fazer upload de imagens e para isso preciso de outro form setando o enctype para “multipart/form-data”. Atualmente estou usando um modalpanel, mas gostaria de colocar o formulário de upload dentro da página.

Obrigado.