Rails Ajax - load partial view via javascript

Question

I am building a small twitter-like feed. A user has an input, and you have a feed of inputs.

The feed is effectively a list of posts. Each post's view is defined by a _post.html.haml partial view.

I have an AJAX post method that creates a new post in the backend. The problem is that you have to refresh the page to actually view the post appear on the feed.

I would like to append the html to the feed column. However, I create a post on the feed column using a partial view that takes in a local variable of the post details.

Partial views are on the server side. How can I still use the same partial view to obtain the html code for the new post I have created so that I can append it to feed column without having to refresh the page.

Thanks!

addiedx44 · Accepted Answer · 2013-01-27 04:43:43Z

1

Try render(:update) in the action you post to:

render(:update) do |page|
  page.replace_html 'divID', :partial => 'your-partial'
end

answered Jan 27, 2013 at 4:43

addiedx44

2,7531 gold badge25 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Chad Johnson Over a year ago

This couples the frontend to the backend because the frontend depends on the backend knowing about the frontend's structure.

coderhs Over a year ago

Can this be one in jQuery as well? As from the documentation it was written as prototype helper.

Rahul Tapali · Accepted Answer · 2013-01-27 04:56:37Z

1

Post code snippets so it can easy to answer. Anyway you can do like this. When you are creating a new post using get ajax request it will go into your controller action. In controller action you can do:

   def get_new_post   #This is the controller action called by your ajax
     post = Post.create!(ajax_params)
     render :partial => "post", :locals => {:post => post}
   end

In view you append the new post to post list as below:

$.get("ajax_request", function(data, status){
 if(status=="success"){  //if your ajax is success
   $("#post-list").append(data)  //Assuming post-list is the div id of list of posts
 }
});

edited Jan 27, 2013 at 4:56

answered Jan 27, 2013 at 4:51

Rahul Tapali

10.2k7 gold badges33 silver badges45 bronze badges

5 Comments

Karan Over a year ago

how would the render know where exactly to render the partial?

Rahul Tapali Over a year ago

you will get rendered data in data of your ajax request so you can append it to post list

Karan Over a year ago

this probably could work (will try it out now). I was wondering if you can you replace the html via the controller as shown by adamdunson? It would mean that I would not have to write up the javascript code as shown. I could not get adamdunson's code to work ...

Rahul Tapali Over a year ago

In adamdunson case might work when you have the partial for list of posts. But when you have partial for displaying single post my solution will work. I think there may be other solutions. But I normally use this one.

Rahul Tapali Over a year ago

anyway you are creating the post using ajax so it will be the get request so response data will contain the your new post when you do render partial

Collectives™ on Stack Overflow

Rails Ajax - load partial view via javascript

2 Answers 2

2 Comments

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related