Rendering partial view through javascript file ruby on rails

Question

I have an index file which contains google map just (map through javascript) . when I search some place, it also pins its nearby on the map that's good now . But what I want is , when ever I click on marker on the map . It should show a div of place detail on the same page below the map . I made ajax assets/javascript/customer.js , pointing the URL at customer controller in controller/customers/index I get the whole page in response . that's we know is wrong . Here is my js file content

$.ajax({
  url: "/",
  async: false,
  method: "post",
  data: { "place_id" : place["place_id"] },
  success: function(data){
       alert('success');
     }
   });
   infoWindow.open(map, marker);
   buildIWContent(place);
});

And my controller function is

def index
  if params[:place_id]
    @place = Places.find(params['place_id'])
  end
end

And this is what I want to show in my index page i.e html.erb

<% if @place %>
  <div class='place-name'><% @place.name %></div>
<% end %>

I know there are partials supported in rails but I don't know whether those will work or not . I'm new to Rails so pardon me if you find my question very silly. I just want to show this place-name div through ajax magic, whether through partials or just as it is.

do you have an index.js file in the same dir as your index.html view? By default Rails will look for a .js with the same name as the controller action. — Matt Ramirez
– Matt Ramirez, Commented Oct 9, 2015 at 12:47
@MattRamirez yeah i have .js.erb but i tried to make alert('hi') but alert didn;t work — Mani
– Mani, Commented Oct 9, 2015 at 12:49

akbarbin · Accepted Answer · 2015-10-09 13:21:46Z

2

To fix you problem, you have to revised some code here. First, you have to revised your ajax request method and url into:

$.ajax({
  url: "/customers",
  async: false,
  method: "GET",
  data: { "place_id" : place["place_id"] },
  success: function(data){
       alert('success');
     }
   });
   infoWindow.open(map, marker);
   buildIWContent(place);
});

It will show alert when you've done to access the customers index page. Then. In your index method, try to do this:

def index
  if params[:place_id]
    @place = Places.find(params['place_id'])
  end
  respond_to do |format|
    format.html
    format.js
  end
end

Then. You have to create new file index.js.erb contains

$('.place-name').text('<%= @place %>');

It's only prototype. You have to customize with your own way

answered Oct 9, 2015 at 13:21

akbarbin

5,1051 gold badge31 silver badges31 bronze badges

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

6 Comments

Mani Over a year ago

dear i tried this kind of example too and i also thought that this simple thing should work , but it's not working

akbarbin Over a year ago

Let me know, what is your console log respond?

Mani Over a year ago

The change i noticed in my code you made , is just respond_to element . But i got something working . and shortly i'll post my solution and blockage reason .Thanks :) have a good day

akbarbin Over a year ago

Okay. It sounds good. :) Let me know about this because I am a bit curious. :)

Mani Over a year ago

I copied your code and made it work by placing format.js above format.html . other wise it'll not hit js.erb file . as i tested many times in my code

|

Josh Bodah · Accepted Answer · 2015-10-09 12:51:21Z

0

If I understand your question correctly you want to render a Rails partial as the response to an AJAX call. If that's the case, then that's the wrong way to think about it.

Rails is just a web server. It returns text payloads that can be JSON, XML, or HTML (among other things). A partial or ERB template is just an abstraction for that generated JSON or HTML.

When you load the page, Rails compiles the ERB (and partials, layouts, etc) into an HTML payload and returns that. So if you were to make an AJAX request to an endpoint, you'd get all of the HTML (including layouts). You could do something like render layout: false to not render the layout, but then you need a conditional or a separate endpoint to know when to render the layout and when not to.

In general the community seems to be moving away from this for AJAX requests preferring client-side templating from JSON server responses, but you can still do it by adding layout: false (or whatever layout you want)

edited Oct 9, 2015 at 12:51

answered Oct 9, 2015 at 12:48

Josh Bodah

1,2439 silver badges17 bronze badges

7 Comments

Mani Over a year ago

so dear , you mean i can't do it ?

Josh Bodah Over a year ago

@ImranNaqvi you can. I think what you're looking for is layout: false. Give that a shot

Josh Bodah Over a year ago

Assuming your endpoint for index is only being used for AJAX HTML responses, you could have an index action in your controller, use index.html.erb for your template, and put render layout: false in your controller to specify that you don't want the template to be included in the response HTML. The Rails guide for render has more information: guides.rubyonrails.org/layouts_and_rendering.html#using-render

Mani Over a year ago

man i read that article before . but i think that you got it wrongly . I have index.html.erb file but in that index.html.erb file i have that if place statement as i described in my question .

Mani Over a year ago

and i want to show that div with place name after ajax call as you can see in my question :(

|

Collectives™ on Stack Overflow

Rendering partial view through javascript file ruby on rails

2 Answers 2

6 Comments

7 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

7 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related