Dúvida com rich effect

8 respostas
Flasoft
Alguém já conseguiu fazer isto funcionar desta forma?
<div id="contentDiv">... texto aqui ...</div>

<a4j:commandButton  onclick="hideDiv({duration:0.7})" value="Hide" />
<a4j:commandButton  onclick="showDiv()" value="Show" />

<rich:effect  name="hideDiv"  for="contentDiv" type="Fade" />
<rich:effect  name="showDiv"  for="contentDiv" type="Appear" />
Exemplo tirado daqui: [url]http://www.jboss.org/file-access/default/members/jbossrichfaces/freezone/docs/development/userguide/en/html/rich_effect.html[/url] Eu consegui fazer funcionar assim:
<div id="contentDiv">... texto aqui ...</div>

<a4j:commandButton value="Hide">
	<rich:effect event="onclick" type="Fade" targetId="contentDiv"/>
</a4j:commandButton>
<a4j:commandButton value="Show">
	<rich:effect event="onclick" type="Appear" targetId="contentDiv"/>
</a4j:commandButton>
Agora meu problema é que eu queria disparar dois efeitos por um clique... Alguém sabe como fazer? Algo tipo:
<div id="contentDiv">... texto aqui ...</div>
<div id="contentDiv2">... texto aqui 2 ...</div>

<a4j:commandButton value="Hide">
	<rich:effect event="onclick" type="Appear" targetId="contentDiv"/>
	<rich:effect event="onclick" type="Fade" targetId="contentDiv2"/>
</a4j:commandButton>
<a4j:commandButton value="Show">
	<rich:effect event="onclick" type="Fade" targetId="contentDiv"/>
	<rich:effect event="onclick" type="Appear" targetId="contentDiv2"/>
</a4j:commandButton>
Mas na implementacao acima é como se o primeiro efeito sobrescrevesse o segundo efeito para cada div (imagino que seja por conta do event="onclick")... Alguém sabe como resolver isto?

8 Respostas

Flasoft

Ninguém sabe fazer?

Raarm

Tenta criar um JS com os effects e chamar ele no onclick do commandButton!

Usa no JS:

Effect.Fade(contentDiv, { duration:0.7}); 

Effect.Appear(contentDiv2, { duration:0.7});

Abs!

Flasoft

Aoooooooooooooooooooooooooooooo.....
Funcionou perfeitamente....

Eu utilizei assim:

<div id="contentDiv">... texto aqui ...</div>
<div id="contentDiv2">... texto aqui 2 ...</div>

<a4j:commandButton onclick="Effect.Fade(contentDiv2, { duration:0.7}); 
                            Effect.Appear(contentDiv, { duration:0.7});" 
                   value="Hide">
</a4j:commandButton>
<a4j:commandButton onclick="Effect.Fade(contentDiv, { duration:0.7});
                            Effect.Appear(contentDiv2, { duration:0.7});"
                   value="Show">
</a4j:commandButton>

Muito obrigado!

Flasoft

Detalhes importantes....

Com esta nova estratégia minha pagina não tinha mais nenhuma tag "rich:effect" então o Effect.js não era importado: pesquisando na documentacao achei esta linha para importar o js
<a4j:loadScript src="resource://scriptaculous/effect.js" />
Mas não funcionou :? entao só como teste coloquei isto:
<rich:effect />
no topo da pagina (na primeira linha do no meu layout) e funcionou que foi uma blz! Outra coisa interessante é que isto funciona:
<a4j:commandButton value="Upload Nova Imagem">
	<rich:effect event="onclick" type="BlindUp">
</a4j:commandButton>
mas isto não:
<a4j:commandButton id="meuCmd" value="Upload Nova Imagem"
				   onclick="Effect.BlindUp(meuCmd, { duration:0.7}); 
							Effect.BlindDown(divUploadImagemPadrao, { duration:0.7});"
				   />
Como solução de contorno:
<div id="divUploadNovaImagem">
	<a4j:commandButton value="Upload Nova Imagem"
					   onclick="Effect.BlindUp(divUploadNovaImagem, { duration:0.7}); 
								Effect.BlindDown(divUploadImagemPadrao, { duration:0.7});"
					   />
</div>

[]s
E novamente muito obrigado Raarm

Flasoft

Bom pessoal, a vida é muito dificil… :frowning:

Encontrei outro problema que não estou conseguindo resolver…

Como já falei antes isto aqui não funciona:

<rich:fileUpload id="fupImagemPadrao" maxFilesQuantity="1" acceptedTypes="jpg, gif, png" listHeight="59px" fileUploadListener="#{generoMB.uploadImagemPadrao}" immediateUpload="false" allowFlash="false"> <rich:effect event="onuploadcomplete" type="BlindDown" for="divExcluirImpagemPadrao" params="duration:0.7"/> <a4j:support event="onuploadcomplete" reRender="divPreviewImagemPadrao"/> </rich:fileUpload>

E agora, para este caso isto também não funciona…

<rich:fileUpload id="fupImagemPadrao" maxFilesQuantity="1" acceptedTypes="jpg, gif, png" listHeight="59px" fileUploadListener="#{generoMB.uploadImagemPadrao}" immediateUpload="false" allowFlash="false" onuploadcomplete="Effect.BlindUp(divExcluirImpagemPadrao, {duration:0.7});"> <a4j:support event="onuploadcomplete" reRender="divPreviewImagemPadrao"/> </rich:fileUpload>

Alguém sabe resolver isto?

O mesmo problema ocorre se eu tentar executar um actionListener de um a4j:commandButton junto com o efeito no evento on click…
Uma duvida que eu tenho: e possivel com o executar um JavaScript com a4j:support?

Raarm

No segundo caso tenta colocar:

ajaxSingle="true"
1. &lt;rich:fileUpload id="fupImagemPadrao"  
   2.                  maxFilesQuantity="1"  
   3.                  acceptedTypes="jpg, gif, png"  
   4.                  listHeight="59px"  
   5.                  fileUploadListener="#{generoMB.uploadImagemPadrao}"  
   6.                  immediateUpload="false"  
   7.                  allowFlash="false"  
   8.                  onuploadcomplete="Effect.BlindUp(divExcluirImpagemPadrao, {duration:0.7});"&gt;  
   9.     &lt;a4j:support event="onuploadcomplete" reRender="divPreviewImagemPadrao" ajaxSingle="true"/&gt;  
  10. &lt;/rich:fileUpload&gt;

Eu ainda nao usei o fileUpload mas vi no livedemo a tag onfileuploadcomplete tenta usá-la no a4j:support ao invés da onuploadcomplete!!

Abs

Raarm

Ah esqueci de falar…eu tb to com um problema de richfaces!!

Quem sabe vc nao pode dar uma força!!!

http://www.guj.com.br/posts/list/149359.java

Abs

Raphael

Flasoft

Resolvido… 8)

Para o FileUpload ficou:

<rich:fileUpload id="fupImagemPadrao" maxFilesQuantity="1" acceptedTypes="jpg, gif, png" listHeight="59px" fileUploadListener="#{generoMB.uploadImagemPadrao}" immediateUpload="false" allowFlash="false"> <a4j:support event="onuploadcomplete" reRender="divPreviewImagemPadrao, fupImagemPadrao" oncomplete="Effect.BlindDown(divExcluirImpagemPadrao, {duration:0.7}); Effect.BlindDown(divUploadNovaImagem, {duration:0.7}); Effect.BlindUp(divUploadImagemPadrao, {duration:0.7});"/> </rich:fileUpload>

e para botões com actionListener ficou:

<a4j:commandButton actionListener="#{generoMB.excluirImagemPadrao}" reRender="divPreviewImagemPadrao" value="Apagar Imagem" oncomplete="Effect.BlindUp(divExcluirImpagemPadrao, {duration:0.7});"> </a4j:commandButton>

Vlw a todos que procuraram me ajudar… []s :smiley:
Nota: mas ainda acho q tem muita gambi pra fazer funcionar

Criado 14 de janeiro de 2010
Ultima resposta 18 de jan. de 2010
Respostas 8
Participantes 2