Question

I’m thinking of implementing something like the following and would like to know a) if it’s possibly a really bad idea for some reason I haven’t thought of, and b) if not – is there an existing gem out there to do it.

Basically, I’d like to be able to queue javascript events from my rails controllers so that on next render all queued events would be triggered and removed from the queue. Sort of like the flash mechanism but for events instead. So e.g.:

in my controller:

def create
  if resource.create 
    add_event('resourceCreated', :id => resource.id)
  end
end

and in my application layout something like:

%javascript
  - @events.each do |e|
    $(document).trigger(#{e.event_name}, #{e.event_data})

Any thoughts?

Edit: This would be useful e.g. when an item is created, the server may redirect to the edit form for said item, or may redirect to the index action for the relevant controller. These pages don’t know that an item was just created. However perhaps I want to do something like close a dialog window if the item was created successfully but leave it open if it was not, or any number of other possible reasons I may need to know about it. Obviously not just relevant for creates, that’s just the example I’m using to illustrate the problem

Edit: Bounty goes to whoever persuades me convincingly one way or the other that this is a good/bad idea or provides a better alternative

Answer 1

I see what you are trying to do, but you need to be careful about keeping things separate.

What I would do in this situation is create a hash and then #to_json it in your view. Let’s say at the bottom of your action

controller

@events = [
   { :type => "item_created", :message => "Woohoo! Item was created"}
]

index.html.erb

<div>Your usual stuff goes here</div>
<script type="text/javascript" charset="utf-8">
  var events = <%= raw @events.to_json %> // You must make sure it's properly sanitised
</script>

jQuery

$.ready(function() { 
   events.each(function () {
      // ... Do what you need to with this
   });
});