我正在使用 Rails3。现在尝试在 index.html.erb 中实现关注按钮,就像 twitter 一样。
它显示成员列表及其关注按钮。
看起来不错,但如果我按下任何跟随按钮,外观不会改变。
它应该立即更改为取消关注。
我不知道为什么会这样。但是如果我重新加载页面,它会显示正确的状态。
follow_controller.rb
class FollowsController < ApplicationController
def create
@user = User.find(params[:user_id])
current_user.follow(@user)
respond_to do |format|
format.js {render :action=>"create.js"}
end
end
def destroy
@user = User.find(params[:user_id])
current_user.stop_following(@user)
respond_to do |format|
format.js {render :action=>"destroy.js"}
end
end
end
意见/用户/_follow_user.html.erb
<% unless user == current_user %>
<% if current_user.following?(user) %>
<%= button_to("Un-Follow", user_follow_path(user.to_param, current_user.get_follow(user).id),
:method => :delete,
:remote => true,
:class => 'btn') %>
<% else %>
<%= button_to("Follow", user_follows_path(user.to_param),
:remote => true,
:class => 'btn btn-primary') %>
<% end %>
<% end %>
意见/用户/create.js.erb
$('.follow_user[data-user-id="<%=@user.id%>"]').html('<%= escape_javascript(render :partial => "follow_user", :locals => {:user => @user}) %>');
#jQuery
意见/用户/destroy.js.erb
$('.follow_user[data-user-id="<%=@user.id%>"]').html('<%= escape_javascript(render :partial => "follow_user", :locals => {:user => @user}) %>');
#jQuery
意见/用户/index.html.erb
<%- model_class = User.new.class -%>
<div class="page-header">
<h1><%=t '.title', :default => model_class.model_name.human.pluralize %></h1>
</div>
<% @from %>
<h3>tag cloud</h3>
<% tag_cloud(@tags, %w(css1 css2 css3 css4)) do |tag, css_class| %>
<%= link_to tag.name, {:action=>'index', :tag=>tag.name}, :class => css_class%>
<% end %>
<%= paginate @users %>
<table class="table table-condensed">
<thead></thead>
<tbody>
<% @users.each do |user| %>
<div class="memberListBox">
<div class="memberList">
<p class="name"><span><%= user.user_profile.nickname %></span>(<%= user.user_profile.age %>)</p>
<p class="size"><%= user.username %></p>
<p class="img">
<% if user.user_profile.user_avatar? %>
<%= image_tag(user.user_profile.user_avatar.url(:thumb),:height => 100, :width => 100, :class => 'img-polaroid' ) %>
<% else %>
<%= image_tag('nophoto.gif',:height => 100, :width => 100, :class => 'img-polaroid' ) %>
<% end %>
</p>
<div class="introduction">
<%= user.user_profile.introduction %>
</div>
<% if user_signed_in? && current_user!=user %>
<div id="follow_user">
<%= render :partial => "follow_user", :locals => {:user => user} %>
</div>
<% end %>
<%= link_to sanitize('<i class="icon-pencil icon-white"></i> ') + 'Message', new_messages_path(user.username), :class => 'btn btn-primary' %>
<%= link_to sanitize('<i class="icon-user icon-white"></i> ') + 'Profile', show_user_path(:username => user.username, :breadcrumb => @from), :class => 'btn btn-info' %>
</div>
</div>
<% end %>
</tbody>
</table>
响应内容
$('#follow_user').html(' <form action=\"/users/1/follows\" class=\"button_to\" data-remote=\"true\" method=\"post\"><div><input class=\"btn btn-primary\" type=\"submit\" value=\"Follow\" /><input name=\"authenticity_token\" type=\"hidden\" value=\"G/taOUeWy2gumhWUi10cPvECAmYLQdhQ2/eGGMJwvPE=\" /><\/div><\/form>
\n');