Question

I’m trying to get two things done after a user clicks on a link:

1. Delete a div
2. Add another element at the bottom of the page

I played with Rails link_to_remote and what I get with the code below is that the element is added before the div is deleted:

<%= link_to_remote "&#x2713;",
  :url => {
    :controller => :movies,
    :action => :mark_as_seen,
    :movie => movie,
    :render => 'movie' },
  :success => "Effect.Fade('movie_#{movie.id}_wrapper', { duration: 0.4 })",
  :update => "movies", :position => "bottom",
  :failure => "alert('Ooops! An error occurred.')"
%>

I tried to put :update and :position in a :complete callback, but nothing happened. And when I put both of them in the :success callback (after Effect.Fade), all I get is a parsing error.

Any idea?

Thanks,

Kevin

Answer 1

I am not entirely sure if i understand correctly, but i am guessing you want the div to be deleted before the :update action takes place.

As usual this is surprisingly simple 🙂

<%= link_to_remote "&#x2713;",
  :url => {
    :controller => :movies,
    :action => :mark_as_seen,
    :movie => movie,
    :render => 'movie' },
  :before => "Effect.Fade('movie_#{movie.id}_wrapper', { duration: 0.4 })",
  :update => "movies", :position => "bottom",
  :failure => "alert('Ooops! An error occurred.')"
%>

so just replace the :success with :before will do that first. Hope this does what you want 🙂

The explanation is simple: the :success action is executed once the complete action is succesfully ended, so also the update. The :before action is executed before the remote action is executed.
For instance i use this all the time to show a spinner during a remote action.