Render a partial view via ajax in Ruby on Rails

Question

currently i am trying to make my rails app single paged, but i am having some problems with the rendering of partials.. Now here is my controller code:

class WelcomeController < ApplicationController
 def create
 @welcome = WelcomeController.new
 render :partial => 'enjoy'
 end
 def index
 if params[:id] == 'enjoy'
 @partial_view = 'enjoy'
 elsif params[:id] == 'about'
 @partial_view = 'about'
 else
 @partial_view = 'main'
 end
 end
end

So this controller is linked to my view, and for the pages to change i was using the code in the index action, but now i am trying to use the thing in the create action. The code of my index.html.slim where i am trying to call the create action is:

 div id="content"
 = form_tag(:url => {:action => 'create'},
 :update => "content", :position => :bottom,
 :html => {:id => 'subject_form'}, 
 :remote => true)
 = submit_tag 'Add'

So on button click 'Add', i am expecting the content from _enjoy.slim.html, which is my partial to go into the div with id "content", but when the button is clicked and the _enjoy.html.slim is rendered it loads on top of the whole index.html.slim page... So i am stuck at that, how can i make it load into the certain div?

Thanks a ton to anyone who has an answer to this one {:

• Hesham: Which version of rails are you running?

Answer 1

Controller:

class WelcomeController < ApplicationController
 def create
 @welcome = WelcomeController.new
 # Remove the render
 end
 def index
 # No change
 end 
end

View:

div id="content"
= form_tag({:action => 'create'}, :id => 'subject_form', :remote => true) do
 = submit_tag 'Add'

Create welcome/create.js.erb and add the following line to it:

$('#content').html("<%= j render(:partial => 'welcome/enjoy') %>")

• victor175: Thanks a lot! <3 I was just wondering, is it possible to make it run with create.js.slim file? Cause i tested it and it did not happen ;[
• Hesham: Maybe? Try to rename the file to create.js.slim. You'll have to change the content to: $('#content').html("#{ j render(:partial => 'welcome/enjoy') }")
• victor175: Umm.. Why #{ j renderer... and not ={ j renderer.. ?
• Hesham: Because #{} is used for text interpolation in slim.

Answer 2

You have to add a create.js.erb file in your 'welcome' views directory and there you have to render the partial per ajax:

$("#content").html("<%= j render(:partial => 'welcome/enjoy') %>");

and in the create action of the controller you have to respond to javascript:

def create
 ...
 respond_to do |format|
 format.js
 end
end