[RESOLVIDO] Apanhando do TabPanel do RichFaces

18 de março de 2013 3 respostas

vejjitt0 18 de março de 2013

Eae pessoal,
Estou com alguns probleminhas com richfaces, mais necessariamente no componente TabPanel são 2 problemas:
1ª
seguinte, tenho um TabPanel e dentro dele tenho quatro Tabs.
preciso que ao clicar em cada Tab eu consiga chamar o método dentro do meu controller, ja mudei o switchType para ajax, cliente, server e nada…
2ª
Dentro da primeira tab tenho alguns inputText´s e um commandButton salvar ao clicar neste commandButton ele acessa o método normalmente e salva meu objeto,
gostaria de saber se após isso teria como eu redirecionar para a segunda Tab pelo mesmo método ???

JSF

&lt;h:form&gt;           
  	&lt;rich:tabPanel switchType="client" id="panel" &gt;
		&lt;rich:tab header="Cadastro"&gt;
			&lt;h:panelGroup id="messagePanel" layout="block"&gt;
				&lt;h:messages errorStyle="color: red" infoStyle="color: green" layout="table" /&gt;
			&lt;/h:panelGroup&gt;
			<br/>				
			&lt;h:panelGrid columns="6" border="0"&gt;								
				&lt;h:outputLabel value="Nome:" for="nome" /&gt;
				&lt;h:outputLabel value="Cpf/Cnpj:" for="cpfCnpj" /&gt;
				&lt;h:outputLabel value="Contrato:" for="contrato" /&gt;
				&lt;h:outputLabel value="Celular:" for="celular" /&gt;
				&lt;h:outputLabel value="Residencial" for="residencial" /&gt;
				&lt;h:outputLabel value="E-mail" for="eMail" /&gt;															
				&lt;h:inputText id="nome" value="#{cadastroClienteController.chamado.nome}" size="20" maxlength="100" required="true"/&gt;
				&lt;h:inputText id="cpfCnpj" value="#{cadastroClienteController.chamado.cpfcnpj}" size="20" maxlength="14" required="true"/&gt;
				&lt;h:inputText id="contrato" value="#{cadastroClienteController.chamado.contrato}" size="20" maxlength="30" required="true"/&gt;
				&lt;h:inputText id="celular" value="#{cadastroClienteController.chamado.telefoneCelular}" size="20" maxlength="20" required="true"/&gt;
				&lt;h:inputText id="residencial" value="#{cadastroClienteController.chamado.telefoneResidencial}" size="20" maxlength="20" required="true"/&gt;
				&lt;h:inputText id="eMail" value="#{cadastroClienteController.chamado.eMail}" size="20" maxlength="100" required="false"/&gt;			                    
			    &lt;h:outputLabel value="" for=""/&gt;
			    &lt;h:outputLabel value="" for=""/&gt;
			    &lt;h:outputLabel value="" for=""/&gt;
			    &lt;h:outputLabel value="" for=""/&gt;
			    &lt;h:outputLabel value="" for=""/&gt;
				&lt;h:commandButton action="#{cadastroClienteController.salvar}" value="Salvar"/&gt;							    	
			&lt;/h:panelGrid&gt; 							
		&lt;/rich:tab&gt;						
		&lt;rich:tab header="Produto"&gt;
			&lt;h:outputLabel value="De tab cadastro vem para esta atraves do metodo salvar"/&gt;
        &lt;/rich:tab&gt;						
	    &lt;rich:tab header="Serviço"&gt;
			&lt;h:outputLabel value="teste"/&gt;
	    &lt;/rich:tab&gt;						
		&lt;rich:tab header="Visita"&gt;		
			&lt;h:outputLabel value="teste"/&gt;		
	    &lt;/rich:tab&gt;						
	&lt;/rich:tabPanel&gt;                     
&lt;/h:form&gt;

METODO

public void salvar(){
		try{
			chamado.setUsuario(usuario);	
			chamado.setClienteCorporativo(clienteCorporativo);
			chamado.setDataCadastro(new Date());
			chamado.setStatusChamado(ConstantesAtendimento.STATUS_ABERTO);
			chamado.setCaso99(ConstantesAtendimento.STATUS_CHAMADO_CASO99_SIM);
			chamadoDAO.save(chamado);
			
			String msg = "Chamado salvo com sucesso!";
			JSFHelper.addSuccessMessage(msg);
			
		} catch (Exception e) {
			String msg = "Erro ao salvar chamado";
			logger.error(msg, e);
			JSFHelper.addErrorMessage(msg);
		}
	}

Agradeço desde já todas as repostas…

3 Respostas

vejjitt0 18 de mar. de 2013

O primeiro de mudar as tabs e chamar o metodo eu consegui segue o que eu fiz:

JSF

&lt;h:form&gt;

 &lt;a4j:jsFunction id="jsTeste" name="executaJS" action="#{cadastroClienteController.teste}"/&gt;           
  			&lt;rich:tabPanel switchType="ajax" id="panel" onbeforeitemchange="executaJS();"&gt;

METODO

public void teste(){
		System.out.println("tabbbbb");
	}

Mudei o switchType para ajax, tinha tentado o onClick mas não deu certo qualquer click na tela ele dava alert, dai tentei o onbeforeitemchange e funcionou com um alert.
dai pense a4j e tcharammmmmmm funfou a primeira parte.

Ainda preciso de ajuda para o metodo ir para a proxima tab.

vejjitt0 19 de mar. de 2013

Agora se você quiser que cada aba acesse um metodo diferente no controller você pode fazer assim:

JSF

&lt;h:form&gt;
                       
  					&lt;rich:tabPanel switchType="server" id="panel"&gt;
  					    
  					    &lt;a4j:jsFunction id="jsCadastro" name="executaJSCadastro" action="#{cadastroClienteController.abaCadastro}"/&gt;
						&lt;rich:tab header="Cadastro" onheaderclick="executaJSCadastro();"&gt;							
							&lt;h:panelGrid columns="2"&gt;
		                     	&lt;h:outputLabel value="Número chamado:" for=""/&gt;
					            &lt;h:outputLabel value="#{cadastroClienteController.chamado.id}" for=""/&gt;
		                    &lt;/h:panelGrid&gt;
	                    &lt;/rich:tab&gt;
						
						&lt;a4j:jsFunction id="jsProduto" name="executaJSProduto" action="#{cadastroClienteController.abaProduto}"/&gt;
						&lt;rich:tab header="Produto" onheaderclick="executaJSProduto();"&gt;
						
							&lt;h:panelGrid columns="2"&gt;
		                     	&lt;h:outputLabel value="Número chamado:" for=""/&gt;
					            &lt;h:outputLabel value="#{cadastroClienteController.chamado.id}" for=""/&gt;
		                    &lt;/h:panelGrid&gt;
		                     
						&lt;/rich:tab&gt;
						
						&lt;a4j:jsFunction id="jsServico" name="executaJSServico" action="#{cadastroClienteController.abaServico}"/&gt;
						&lt;rich:tab id="servico" header="Serviço" onheaderclick="executaJSServico();"&gt;
						
							&lt;h:panelGrid columns="2"&gt;
		                     	&lt;h:outputLabel value="Número chamado:" for=""/&gt;
					            &lt;h:outputLabel value="#{cadastroClienteController.chamado.id}" for=""/&gt;
		                    &lt;/h:panelGrid&gt;
						&lt;/rich:tab&gt;
						
						&lt;a4j:jsFunction id="jsVisita" name="executaJSVisita" action="#{cadastroClienteController.abaVisita}"/&gt;						
						&lt;rich:tab header="Visita" onheaderclick="executaJSVisita();"&gt;
						
							&lt;h:panelGrid columns="2"&gt;
		                     	&lt;h:outputLabel value="Número chamado:" for=""/&gt;
					            &lt;h:outputLabel value="#{cadastroClienteController.chamado.id}" for=""/&gt;
		                    &lt;/h:panelGrid&gt;
		                     
						&lt;/rich:tab&gt;
						
					&lt;/rich:tabPanel&gt;
					
            &lt;/h:form&gt;

Note que troquei o switchType para server.

JAVA

public void abaCadastro(){
		System.out.println("abaCadastro &gt;&gt;&gt; " );
	}
	
	public void abaProduto(){
		System.out.println("abaProduto &gt;&gt;&gt; " );
	}
	
	public void abaServico(){
		System.out.println("abaServico &gt;&gt;&gt; " );
	}
	
	public void abaVisita(){
		System.out.println("abaVisita &gt;&gt;&gt; " );
	}

vejjitt0 21 de mar. de 2013

Bem consegui a segunda dúvida também
que era através de método no bean ou controller conseguir mudar de uma tab para outra.
segue o que eu fiz:
primeiramente estou na versão 4.3.0, então tive de no controller criar um binding do componente de abas.

se você estiver no richfaces 3 é assim:

private HtmlTabPanel tabPanel; 
//criar getters ans setters
//fazer isso dentro do seu método chamado na aba que antecede a troca
tabPanel.setSelectedTab("tab de destino");

se você estiver no richfaces 4 é assim:

UITabPanel tabPanel; 
//criar getters ans setters
//fazer isso dentro do seu método chamado na aba que antecede a troca
tabPanel.setActiveItem("tab de destino");

então vamos lá:

JSF

&lt;h:form&gt;                     
        &lt;rich:tabPanel switchType="client" id="panel" binding="#{seuBeanOuController.tabPanel}"&gt;  
            &lt;a4j:jsFunction id="jsCadastro" name="executaJSCadastro" action="#{seuBeanOuController.abaCadastro}"/&gt;  
			&lt;rich:tab id ="TAB_1" name="TAB_1" header="Cadastro" onheaderclick="executaJSCadastro();"&gt;                           
				&lt;h:panelGroup id="messagePanel" layout="block"&gt;  
					&lt;h:messages errorStyle="color: red" infoStyle="color: green" layout="table" /&gt;  
				&lt;/h:panelGroup&gt;  
				<br/>               
				&lt;h:panelGrid columns="6" border="0"&gt;                                
					&lt;h:outputLabel value="Nome:" for="nome" /&gt;  
					&lt;h:outputLabel value="Cpf/Cnpj:" for="cpfCnpj" /&gt;  
					&lt;h:outputLabel value="Contrato:" for="contrato" /&gt;  
					&lt;h:outputLabel value="Celular:" for="celular" /&gt;  
					&lt;h:outputLabel value="Residencial" for="residencial" /&gt;  
					&lt;h:outputLabel value="E-mail" for="eMail" /&gt;
					
					&lt;h:inputText id="nome" value="#{seuBeanOuController.nome}" size="20" maxlength="100" required="true"/&gt;  
					&lt;h:inputText id="cpfCnpj" value="#{seuBeanOuController.cpfcnpj}" size="20" maxlength="14" required="true"/&gt;  
					&lt;h:inputText id="contrato" value="#{seuBeanOuController.contrato}" size="20" maxlength="30" required="true"/&gt;  
					&lt;h:inputText id="celular" value="#{seuBeanOuController.telefoneCelular}" size="20" maxlength="20" required="true"/&gt;  
					&lt;h:inputText id="residencial" value="#{seuBeanOuController.telefoneResidencial}" size="20" maxlength="20" required="true"/&gt;  
					&lt;h:inputText id="eMail" value="#{seuBeanOuController.eMail}" size="20" maxlength="100" required="false"/&gt; 
					
					&lt;h:outputLabel value="" for=""/&gt;  
					&lt;h:outputLabel value="" for=""/&gt;  
					&lt;h:outputLabel value="" for=""/&gt;  
					&lt;h:outputLabel value="" for=""/&gt;  
					&lt;h:outputLabel value="" for=""/&gt;  
					&lt;h:commandButton action="#{seuBeanOuController.salvar}" value="Salvar"/&gt;                                      
				&lt;/h:panelGrid&gt;                              
			&lt;/rich:tab&gt;  
			
			&lt;a4j:jsFunction id="jsProduto" name="executaJSProduto" action="#{seuBeanOuController.abaProduto}"/&gt;
			&lt;rich:tab id ="TAB_2" name="TAB_2" header="Produto" onheaderclick="executaJSProduto();"&gt;						
				&lt;h:panelGrid columns="4"&gt;
		            &lt;h:outputLabel value="Número chamado:" for=""/&gt;
					&lt;h:outputLabel value="#{seuBeanOuController.id}" for=""/&gt;
					&lt;h:outputLabel value="#{seuBeanOuController.nome}" for=""/&gt;
				&lt;/h:panelGrid&gt;
		            &lt;a4j:commandButton id="botaoFechar" value="Fechar" /&gt;
                    &lt;rich:componentControl for="modalInformacoes" attachTo="botaoFechar" operation="hide" event="onmouseup" /&gt;     
			&lt;/rich:tab&gt;
						
			&lt;a4j:jsFunction id="jsServico" name="executaJSServico" action="#{seuBeanOuController.abaServico}"/&gt;
			&lt;rich:tab id ="TAB_3" name="TAB_3" header="Serviço" onheaderclick="executaJSServico();"&gt;						
				&lt;h:panelGrid columns="3"&gt;
		            &lt;h:outputLabel value="Número chamado:" for=""/&gt;
					&lt;h:outputLabel value="#{seuBeanOuController.id}" for=""/&gt;
					&lt;h:outputLabel value="#{seuBeanOuController.nome}" for=""/&gt;
		        &lt;/h:panelGrid&gt;
			&lt;/rich:tab&gt;
						
			&lt;a4j:jsFunction id="jsVisita" name="executaJSVisita" action="#{seuBeanOuController.abaVisita}"/&gt;						
			&lt;rich:tab id ="TAB_4" name="TAB_4" header="Visita" onheaderclick="executaJSVisita();"&gt;						
				&lt;h:panelGrid columns="3"&gt;
		            &lt;h:outputLabel value="Número chamado:" for=""/&gt;
					&lt;h:outputLabel value="#{seuBeanOuController.id}" for=""/&gt;
					&lt;h:outputLabel value="#{seuBeanOuController.nome}" for=""/&gt;
		        &lt;/h:panelGrid&gt;		                     
			&lt;/rich:tab&gt;			  		
		&lt;/rich:tabPanel&gt;  
    &lt;/h:form&gt;

JAVA

public void salvar(){
		try{

		//faz o salvar
		// no caso do richfaces 3 
		tabPanel.setSelectedTab("TAB_2");
		//no caso do richfaces 4
		tabPanel.setActiveItem("TAB_2");
			
		} catch (Exception e) {
			String msg = "Erro ao salvar chamado";
			logger.error(msg, e);
			JSFHelper.addErrorMessage(msg);
		}
	}

Criado 18 de março de 2013

Ultima resposta 21 de mar. de 2013

Respostas 3

Participantes 1

3 Respostas

Topicos relacionados