Databases
StackOverflow2013
Postsdbo
POajax not working with jquery-rails
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POajax not working with jquery-rails
    text
    copied!<p>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:</p> <pre><code>class User &lt; ActiveRecord::Base has_many :memberships has_many :groups, :through =&gt; :memberships has_many :groups_as_owner, :class_name =&gt; "Group" . . . def member?(group) memberships.find_by_group_id(group) end def join!(group) memberships.create!(:group_id =&gt; group.id) end def leave!(group) memberships.find_by_group_id(group).destroy end . . . end class Group &lt; ActiveRecord::Base has_many :memberships has_many :members, :through =&gt; :memberships, :source =&gt; :user belongs_to :owner, :class_name =&gt; "User", :foreign_key =&gt; :user_id has_attached_file :photo, :styles =&gt; { :thumb =&gt; "100x100", :small =&gt; "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 &lt; ActiveRecord::Base attr_accessible :group_id belongs_to :user belongs_to :group end </code></pre> <p>Here is the membership controller:</p> <pre><code>class MembershipsController &lt; 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 </code></pre> <p>I am trying to implement an AJAX controlled Join/Leave button for groups with the following jquery: view/memberships/create.js.erb</p> <pre><code>$('#join_form').html("&lt;%= escape_javascript(render('groups/leave')) %&gt;"); </code></pre> <p>view/memberships/destroy.js.erb</p> <pre><code>$('#join_form').html("&lt;%= escape_javascript(render('groups/join')) %&gt;"); </code></pre> <p>the jquery above acts on the _join_form.html.erb partial that is displayed on a Group show page:</p> <pre><code> &lt;div id="join-form"&gt; &lt;% if current_user.member?(@group) %&gt; &lt;%= render 'leave' %&gt; &lt;% else %&gt; &lt;%= render 'join' %&gt; &lt;% end %&gt; &lt;/div&gt; </code></pre> <p>'leave' partial /groups/_leave.html.erb</p> <pre><code>&lt;%= form_for current_user.memberships.find_by_group_id(@group), :html =&gt; { :method =&gt; :delete }, :remote =&gt; true do |f| %&gt; &lt;div class="actions"&gt;&lt;%= f.submit "Leave" %&gt;&lt;/div&gt; &lt;% end %&gt; </code></pre> <p>'join' partial /groups/_join.html.erb</p> <pre><code>&lt;%= form_for current_user.memberships. build(:group_id =&gt; @group.id), :remote =&gt; true do |f| %&gt; &lt;div&gt;&lt;%= f.hidden_field :group_id %&gt;&lt;/div&gt; &lt;div class="actions"&gt;&lt;%= f.submit "Join" %&gt;&lt;/div&gt; &lt;% end %&gt; </code></pre> <p>Here is my view/layout/application.html.erb where I include various javascript stuff:</p> <pre><code>&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;&lt;%= title %&gt;&lt;/title&gt; &lt;%= javascript_include_tag :all %&gt; &lt;%= csrf_meta_tag %&gt; &lt;%= render 'layouts/stylesheets' %&gt; &lt;/head&gt; &lt;body&gt; &lt;div class="container"&gt; &lt;%= render 'layouts/header'%&gt; &lt;section class="round"&gt; &lt;%= yield %&gt; &lt;/section&gt; &lt;%= render 'layouts/footer' %&gt; &lt;%= debug(params) if Rails.env.development? %&gt; &lt;/div&gt; &lt;%= javascript_include_tag 'jquery','jquery.min','rails.validations' %&gt; &lt;%= javascript_include_tag :all, :cache =&gt; true %&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>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 <a href="http://lindsaar.net/2010/5/9/Getting-Rails-3-Edge-with-jQuery-RSpec-and-Cucumber-using-RVM" rel="nofollow">http://lindsaar.net/2010/5/9/Getting-Rails-3-Edge-with-jQuery-RSpec-and-Cucumber-using-RVM</a> and the membership 'helper' methods member?, join!, and leave! are adapted from Michael Hartl's Ruby on Rails tutorial at <a href="http://ruby.railstutorial.org/chapters/" rel="nofollow">http://ruby.railstutorial.org/chapters/</a> Thanks, Brian</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload