# Timing of effects before and after Ajax call **URL:** \ **Category:** Rails\ **Created:** [March 2, 2006, 9:17am UTC](https://www.ruby-forum.com/t/timing-of-effects-before-and-after-ajax-call/54355 "2006-03-02T09:17:22Z")\ **Posts on this page:** 8\ **Page:** 1
**Author:** ![Axel\_Derks](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/a/71c47a/32.png) [@Axel\_Derks](https://www.ruby-forum.com/u/Axel_Derks)\ **Post date:** [March 2, 2006, 9:17am UTC](https://www.ruby-forum.com/t/timing-of-effects-before-and-after-ajax-call/54355/1 "2006-03-02T09:17:22Z")
Hello, I have a problem with the timing of effects. I do have a tag (with id: post1). When the link is clicked, the block “post1” must BlindUp. Then the block is updated with the new content and then the effect BlindDown is executed. Below is the source code of the link\_to\_remote I am using. \<%= link\_to\_remote(“Ajax Edit”, :update =\> ‘post1’, :before =\> “new Effect.BlindUp(‘post1’)”, :complete =\> “new Effect.BlindDown(‘post1’, {queue: end’})”, :url =\> { :action =\> :ajax\_edit, :id =\> post }) %\> The problem is that during the BlindUp effect, the block is already updated so while the block is “closing”, the new content is already visible for the user. Is it possible to make sure that the content of the block is changed AFTER the effect BlindUp is completed? Thank you in advance, Axel ---
**Author:** ![Axel\_Derks](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/a/71c47a/32.png) [@Axel\_Derks](https://www.ruby-forum.com/u/Axel_Derks)\ **Post date:** [March 8, 2006, 11:15pm UTC](https://www.ruby-forum.com/t/timing-of-effects-before-and-after-ajax-call/54355/2 "2006-03-08T23:15:09Z")
Make a new div in ‘post1’ for example ‘content’ :update =\> ‘content’ :loading =\> “Element.hide(‘content’);new Effect.BlindUp(‘post1’)”, So we reverse the problem. Even if it fills the data in the div it is hidden from view. Not tested but I think it maybe will work. ---
**Author:** ![Axel\_Derks](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/a/71c47a/32.png) [@Axel\_Derks](https://www.ruby-forum.com/u/Axel_Derks)\ **Post date:** [March 8, 2006, 11:59pm UTC](https://www.ruby-forum.com/t/timing-of-effects-before-and-after-ajax-call/54355/3 "2006-03-08T23:59:31Z")
I don’t get it. You are using two div’s. What if you are updating the div that you are trying to fade out and then in? Where would you place this content div? Peter wrote: > Make a new div in ‘post1’ for example ‘content’ > > :update =\> ‘content’ > :loading =\> “Element.hide(‘content’);new Effect.BlindUp(‘post1’)”, > > So we reverse the problem. > Even if it fills the data in the div it is hidden from view. > Not tested but I think it maybe will work. ---
**Author:** ![Axel\_Derks](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/a/71c47a/32.png) [@Axel\_Derks](https://www.ruby-forum.com/u/Axel_Derks)\ **Post date:** [March 8, 2006, 5:02pm UTC](https://www.ruby-forum.com/t/timing-of-effects-before-and-after-ajax-call/54355/4 "2006-03-08T17:02:50Z")
I never found an answer to this question, and I would like to know also. I can’t seem to find any documentation on the web for this. On Thu, 2006-03-02 at 09:17 +0100, Axel Derks wrote: > the block is changed AFTER the effect BlindUp is completed? > Rails mailing list > removed\_email\_address@domain.invalid > [http://lists.rubyonrails.org/mailman/listinfo/rails](http://lists.rubyonrails.org/mailman/listinfo/rails) Charlie B. Programmer Castle Branch Inc. ---
**Author:** ![Axel\_Derks](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/a/71c47a/32.png) [@Axel\_Derks](https://www.ruby-forum.com/u/Axel_Derks)\ **Post date:** [May 3, 2006, 10:37pm UTC](https://www.ruby-forum.com/t/timing-of-effects-before-and-after-ajax-call/54355/5 "2006-05-03T22:37:34Z")
Did anyone ever figure out how to work around this? It seems like a common enough problem. charlie bowman wrote: > The following works great by hiding a div and then fading it in, but it > won’t work with a fade out and then a fade in. The “right\_content” > keeps switching before the fadeout is over. I’ve been asking this > question for two days and I know somebody out there knows or atleast > knows of an example on the web, right? ---
**Author:** ![Axel\_Derks](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/a/71c47a/32.png) [@Axel\_Derks](https://www.ruby-forum.com/u/Axel_Derks)\ **Post date:** [May 3, 2006, 10:44pm UTC](https://www.ruby-forum.com/t/timing-of-effects-before-and-after-ajax-call/54355/6 "2006-05-03T22:44:46Z")
The only hack I came up with was to use the rjs delay function. There is currently no other way to accomplish this without writing you own javascript code. This is the number one thing on my rails wishlist. Charlie bowman [www.recentrambles.com](http://www.recentrambles.com) ---
**Author:** ![Axel\_Derks](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/a/71c47a/32.png) [@Axel\_Derks](https://www.ruby-forum.com/u/Axel_Derks)\ **Post date:** [March 9, 2006, 12:48am UTC](https://www.ruby-forum.com/t/timing-of-effects-before-and-after-ajax-call/54355/7 "2006-03-09T00:48:29Z")
The following works great by hiding a div and then fading it in, but it won’t work with a fade out and then a fade in. The “right\_content” keeps switching before the fadeout is over. I’ve been asking this question for two days and I know somebody out there knows or atleast knows of an example on the web, right? \<%= link\_to\_remote(image\_tag(url\_for\_file\_column(product, “image\_url”), “class” =\> “product\_hover”, “onMouseOver” =\> “this.className = ‘small\_product’”, “onMouseOut” =\> “this.className = ‘product\_hover’”), :before =\> visual\_effect(:fade, “right\_content”, :duration =\> 0.5, :queue =\> ‘front’), :loading =\> “Element.hide(‘right\_content’)”, :update =\> ‘right\_content’, :url =\> { :action =\> :product\_details, :id =\> product.id }, :complete =\> visual\_effect(:appear, “right\_content”, :duration =\> 1.5,:queue =\> ‘end’) )%\> ---
**Author:** ![Axel\_Derks](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/a/71c47a/32.png) [@Axel\_Derks](https://www.ruby-forum.com/u/Axel_Derks)\ **Post date:** [May 3, 2006, 11:31pm UTC](https://www.ruby-forum.com/t/timing-of-effects-before-and-after-ajax-call/54355/8 "2006-05-03T23:31:21Z")
Charlie B. wrote: > The only hack I came up with was to use the rjs delay function. There > is currently no other way to accomplish this without writing you own > javascript code. This is the number one thing on my rails wishlist That’s too bad. I have a big fat static page full of divs, and I’m currently navigating between them by fading one out while fading the next one in. I was hoping that Rails would let me refactor all that content into separate files, while keeping the trippy crossfade. What I’d really like to do is simultaneously (more or less) fade out the old content while fading in the new, and I don’t think I can accomplish that anyway… not without using multiple divs as buffers or something, and that’s the problem I’m trying to get rid of.