how to render a partial using link_to with rails 4.2.2

Viewed 4647

I would like to have my user click a 'Bio' link located in their Profile Page that will display their bio contents pulled from the database. For this I have created a partial lovelies/_bio.html.erb because i would like to load the 'user bio' on their 'Profile Page' and not send them off to another page.

Presently, the partial is unable to be found. This is my code below.

In my routes.rb file, i have created a url path for the bio action which translates to

    bio_lovely_path url -> /lovelies/:id/bio 

This is done in this manner since i need to retrieve that particular user's information i created it as a member.

config/routes.rb

resources :lovelies do
  member do
    get 'bio'
  end
 end

My link is in my layouts/_header.html.erb

 if logged_in?
  <li class="header-log"><%= link_to "Bio", bio_lovely_path, :remote => true %></li>
else
//display none logged in links
 <%end%>

My controller where I have the action is called

LovelyController, the bio action is defined as follows

//display the current user bio

    def bio
      @lovely = Lovely.find(params[:id])
      respond_to |format|
       format.js
      end
    end

I have a jQuery call in my lovelies.coffee file to render the lovelies/_bio.html.erb partial to the div in my lovelies/show.html.erb

    jQuery ->$('#partial).html '<%= escape_javascript(render 'bio') %>

My output says throws a 500 error - Failed to load resource.

My understanding is that the jQuery adds that html to the <div> in show.html.erb which process it as ruby and should result in the _bio.html.erb being rendered. I am new to Rails and would really appreciate suggestions and guidance on how to go about solving this issue. Thanks

3 Answers

Found a simple solution

  1. Create a container to hold the rendered partial.
  2. Use Coffeescript events to trigger the partial to be rendered once the associated id is clicked.

html file - //button to click and display bio on the page

<button id="display-bio">Lovely Bio </button>

//the div which displays the bio on the page

<div id="bio" style='display:none'>
    <%= render 'layouts/bio'%>
</div>

code in coffeescript

//the code in coffee script to trigger the event

$('#display-bio).click ->
    $('#bio).show()

I think that's pretty simple.

Related