Rails 3 AJAX problem - UJS - ruby-on-rails

Question

Ok so here is my setup, I think I have everything set up correctly but for some reason the page isn't displaying the AJAX response.
Basically I have a members list and want to display their "profile" with ajax on the same page.
In views/member/index.html.erb
<table>
<tr>
<th>Name</th>
</tr>
<% #members.each do |member| %>
<tr>
<td><%= member.name %> & <%= member.sname %></td>
<td><%= link_to 'Show', member, :remote => true %></td>
<td><%= link_to 'Edit', edit_member_path(member) %></td>
<td><%= link_to 'Destroy', member, :confirm => 'Are you sure?', :method => :delete %> </td>
</tr>
<% end %>
</table>
<%= link_to 'New Member', new_member_path %>
<div id="memberprofile">
</div>
In my members controller I have this:
def show
#member = Member.find(params[:id])
respond_to do |format|
format.html # show.html.erb
format.js
format.xml { render :xml => #member }
end
end
Then in my _show.js.rjs I have this
page.replace_html('memberprofile', render(#member))
Then in my _member.html.erb partial I have this:
<h1><%= #member.name %></h1>
A few questions:
1) From the console it says "Rendered members/show.html.erb" but I thought it would just render the member partial. why is this?
2) Nothing is happening in the index.html.erb page when the ajax call goes out. I thought having the div hook plus the javascript file would do the trick...
Thanks guys

Answer 1

you have to create a new partial that only display the profile of member. Lets say the partial name is _member.html.erb
in your index file do:
<%= javascript_include_tag "jquery-1.4.4.min.js", "jquery.form" %>
<script type="text/javascript"> var $j = jQuery.noConflict();</script>
<table>
<tr>
<th>Name</th>
</tr>
<% #members.each do |member| %>
<tr>
<td><%= member.name %> & <%= member.sname %></td>
<td><%= link_to 'Show', "javascript:", :onclick => "show_member(member.id)" %></td>
<td><%= link_to 'Edit', edit_member_path(member) %></td>
<td><%= link_to 'Destroy', member, :confirm => 'Are you sure?', :method => :delete %> </td>
</tr>
<% end %>
</table>
<%= link_to 'New Member', new_member_path %>
<div id="memberprofile">
</div>
<script type="text/javascript">
function show_member(m_id) {
var container = $j("#memberprofile");
$j.ajax({
url: '/members/get_member?mid=' + m_id, type: 'get', dataType: 'html',
processData: false,
success: function(data) {
container.html(data);
}
});
}
</script>
in your routes do something like:
resources :members do
collection do
get :get_member
end
end
in your controller do:
def get_member
#member = Member.find_by_id(params[:mid])
render :partial => "member", :layout => false, :locals => {:member => #member}
end
in your _member.html.erb partial
<% unless #member.blank? %>
<h1><%= #member.name %></h1>
<% else %>
Record not found :(
<% end %>