ajax 无法与 jquery-rails 一起使用

发布于 2024-11-17 17:28:56 字数 4434 浏览 5 评论 0原文

我试图让一个按钮在用户单击它后更改其名称/操作，但我无法让 Ajax 工作。刷新页面后似乎有效。我正在使用 jquery-rails gem v.1.0.12。语境：我正在使用 has_many :through 关联：想要通过会员资格加入组的用户 - 这里是模型，以及稍后使用的一些用户方法：

class User < ActiveRecord::Base
 has_many :memberships
 has_many :groups, :through => :memberships
 has_many :groups_as_owner, :class_name => "Group"
.
.
.
  def member?(group)
    memberships.find_by_group_id(group)
  end

  def join!(group)
    memberships.create!(:group_id => group.id)
  end

  def leave!(group)
    memberships.find_by_group_id(group).destroy
  end
.
.
.
end

class Group < ActiveRecord::Base
 has_many :memberships
 has_many :members, :through => :memberships, :source => :user
 belongs_to :owner, :class_name => "User", :foreign_key => :user_id
 has_attached_file :photo, :styles => { :thumb => "100x100",
                                        :small => "200x200" }
 attr_accessible :name, :description, :private, :created_at, :group_id
 attr_accessible :photo, :photo_file_name, :photo_content_type,
                 :photo_file_size,  :photo_updated_at                                  
end

class Membership < ActiveRecord::Base
 attr_accessible :group_id
 belongs_to :user
 belongs_to :group
end

这是会员控制器：

class MembershipsController < ApplicationController
def create
  @group = Group.find(params[:membership][:group_id])
  current_user.join!(@group)
  respond_to do |format|
    format.html { redirect_to @group }
    format.js
  end
end

def destroy
   @group = Membership.find(params[:id]).group
   current_user.leave!(@group)
   respond_to do |format|
     format.html { redirect_to @group }
     format.js
   end
end

def index
  @memberships = Membership.all
end

end

我正在尝试实现 AJAX 控制的加入/具有以下 jquery 的组的“离开”按钮： view/memberships/create.js.erb

$('#join_form').html("<%= escape_javascript(render('groups/leave')) %>");

view/memberships/destroy.js.erb

$('#join_form').html("<%= escape_javascript(render('groups/join')) %>");

上面的 jquery 作用于显示在组显示页面上的 _join_form.html.erb 部分：

  <div id="join-form">
    <% if current_user.member?(@group) %>
      <%= render 'leave' %>
    <% else %>
      <%= render 'join' %>
    <% end %>
  </div>

'leave' 部分 /groups/_leave.html。 erb

<%= form_for current_user.memberships.find_by_group_id(@group),
         :html => { :method => :delete },
         :remote => true do |f| %>
  <div class="actions"><%= f.submit "Leave" %></div>
<% end %>

'join' 部分 /groups/_join.html.erb

<%= form_for current_user.memberships.
                      build(:group_id => @group.id),
                      :remote => true do |f| %>
  <div><%= f.hidden_field :group_id %></div>
  <div class="actions"><%= f.submit "Join" %></div>
<% end %>

这是我的 view/layout/application.html.erb 其中包含各种 javascript 内容：

<!DOCTYPE html>
<html>
<head>
  <title><%= title %></title>
  <%= javascript_include_tag :all %>
  <%= csrf_meta_tag %>
  <%= render 'layouts/stylesheets' %>

</head>
<body>
    <div class="container">
      <%= render 'layouts/header'%>
      <section class="round">
        <%= yield %>
      </section>
      <%= render 'layouts/footer' %>
      <%= debug(params) if Rails.env.development? %>
    </div>
    <%= javascript_include_tag 'jquery','jquery.min','rails.validations' %>
    <%= javascript_include_tag :all, :cache => true %>

</body>
</html>

抱歉代码量很大，但我只是想要彻底，因为似乎很多问题的背景都太少了。如果您想要更多信息，我很乐意提供更多信息。我使用 jquery 是因为在我的初学者看来，原型即将消失，而且我正在使用需要 jquery 的rails-validations gem。如果您发现任何问题，请告诉我，因为我已经研究了几个小时但无法解决。我按照 http://lindsaar.net/2010/5/9/Getting-Rails-3-Edge-with-jQuery-RSpec-and-Cucumber-using-RVM 和会员“助手” ' 方法成员？、加入！、离开！改编自 Michael Hartl 的 Ruby on Rails 教程，网址为 http://ruby.railstutorial.org/chapters/ 谢谢，布莱恩

原文

I am trying to get a button to change its name/action after a user clicks on it, but I can't get the Ajax to work. It seems to work after I refresh the page. I am using the jquery-rails gem v.1.0.12.
Context:
I am working with a has_many :through association: Users who want to join Groups through a Membership- here are the models, and some user methods that are used later:

class User < ActiveRecord::Base
 has_many :memberships
 has_many :groups, :through => :memberships
 has_many :groups_as_owner, :class_name => "Group"
.
.
.
  def member?(group)
    memberships.find_by_group_id(group)
  end

  def join!(group)
    memberships.create!(:group_id => group.id)
  end

  def leave!(group)
    memberships.find_by_group_id(group).destroy
  end
.
.
.
end

class Group < ActiveRecord::Base
 has_many :memberships
 has_many :members, :through => :memberships, :source => :user
 belongs_to :owner, :class_name => "User", :foreign_key => :user_id
 has_attached_file :photo, :styles => { :thumb => "100x100",
                                        :small => "200x200" }
 attr_accessible :name, :description, :private, :created_at, :group_id
 attr_accessible :photo, :photo_file_name, :photo_content_type,
                 :photo_file_size,  :photo_updated_at                                  
end

class Membership < ActiveRecord::Base
 attr_accessible :group_id
 belongs_to :user
 belongs_to :group
end

Here is the membership controller:

class MembershipsController < ApplicationController
def create
  @group = Group.find(params[:membership][:group_id])
  current_user.join!(@group)
  respond_to do |format|
    format.html { redirect_to @group }
    format.js
  end
end

def destroy
   @group = Membership.find(params[:id]).group
   current_user.leave!(@group)
   respond_to do |format|
     format.html { redirect_to @group }
     format.js
   end
end

def index
  @memberships = Membership.all
end

end

I am trying to implement an AJAX controlled Join/Leave button for groups with the following jquery:
view/memberships/create.js.erb

$('#join_form').html("<%= escape_javascript(render('groups/leave')) %>");

view/memberships/destroy.js.erb

$('#join_form').html("<%= escape_javascript(render('groups/join')) %>");

the jquery above acts on the _join_form.html.erb partial that is displayed on a Group show page:

  <div id="join-form">
    <% if current_user.member?(@group) %>
      <%= render 'leave' %>
    <% else %>
      <%= render 'join' %>
    <% end %>
  </div>

'leave' partial /groups/_leave.html.erb

<%= form_for current_user.memberships.find_by_group_id(@group),
         :html => { :method => :delete },
         :remote => true do |f| %>
  <div class="actions"><%= f.submit "Leave" %></div>
<% end %>

'join' partial /groups/_join.html.erb

<%= form_for current_user.memberships.
                      build(:group_id => @group.id),
                      :remote => true do |f| %>
  <div><%= f.hidden_field :group_id %></div>
  <div class="actions"><%= f.submit "Join" %></div>
<% end %>

Here is my view/layout/application.html.erb where I include various javascript stuff:

<!DOCTYPE html>
<html>
<head>
  <title><%= title %></title>
  <%= javascript_include_tag :all %>
  <%= csrf_meta_tag %>
  <%= render 'layouts/stylesheets' %>

</head>
<body>
    <div class="container">
      <%= render 'layouts/header'%>
      <section class="round">
        <%= yield %>
      </section>
      <%= render 'layouts/footer' %>
      <%= debug(params) if Rails.env.development? %>
    </div>
    <%= javascript_include_tag 'jquery','jquery.min','rails.validations' %>
    <%= javascript_include_tag :all, :cache => true %>

</body>
</html>

Sorry for the volume of code, but I just wanted to be thorough because it seems a lot of SO questions have too little context. If you want more info I'd be happy to provide more.
I am using jquery because it seems to my beginner view that prototype is on the way out, and also I am using a rails-validations gem that requires jquery. Please let me know if you see any problems as I have been poring over this for hours and can't figure it out. I put my javascript tags near the end of my application layout as per the advice of http://lindsaar.net/2010/5/9/Getting-Rails-3-Edge-with-jQuery-RSpec-and-Cucumber-using-RVM and the membership 'helper' methods member?, join!, and leave! are adapted from Michael Hartl's Ruby on Rails tutorial at http://ruby.railstutorial.org/chapters/
Thanks,
Brian

分享到QQ

分享到微博