Home/ Questions/Q 6006813
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-23T01:35:36+00:00

I’m using Pusher to add real-time page updates to my Rails app. Here’s a

  • 0

I’m using Pusher to add real-time page updates to my Rails app.

Here’s a brief synopsis of how Pusher works (and later I’ll show you what I’d like it to do):

Controller:

class ThingsController < ApplicationController
  def create
    @thing = Thing.new(params[:thing])

    if @thing.save
      Pusher['things'].trigger('thing-create', @thing.attributes)
    end
  end
end

Javascript (in <head>...</head>):

var pusher = new Pusher('API_KEY');
var myChannel = pusher.subscribe('MY_CHANNEL');
myChannel.bind('thing-create', function(thing) {
  alert('A thing was created: ' + thing.name); // I want to replace this line
});

I want to replace the commented line with an ajax request to trigger some unobtrusive JavaScript. Assume I have the file app/views/things/index.js.erb:

$("things").update("<%= escape_javascript(render(@things))%>");

What should I write in the myChannel.bind callback to trigger the above code to execute?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You are not really comparing apples-to-apples here.

    You are comparing the template rendered in an XHR request to things/index to the attributes of the @thing object from a POST to things/create.

    You need to process the thing object that gets returned from Pusher in the web browser and modify the DOM accordingly.

    Or, an easier solution would probably be to have your controller send formatted HTML to Pusher instead of object attributes. Then your javascript code could just insert the formatted HTML instead of trying to parse the thing object and modify the DOM manually.

    Response to @user94154’s comment:

    DISCLAIMER: I never heard of Pusher until your question.

    This does create a challenge b/c typically your HTML is formatted in the view, but you have to send data to Pusher from the controller. I can think of a few ways to do this:

    1. If it isn’t much HTML markup, you might want to break the “Don’t Repeat Yourself” rule and repeat the HTML markup in your controller and send that to Pusher
    2. If it is a lot of markup, I would abstract my view generation code to helpers. You can call a helper from your controller, too.

    On the client side, you should have an empty div (or some DOM element) that can hold the HTML from Pusher. And do something like this:

    myChannel.bind('thing-create', function(thing) {
  $("div#thing_holder").html(thing.html);
});
    • 0