jquery - Rails 4 ajax acts as votable with turbo links vote counts not updating -
i'm able click on link once, , count update, doesn't update on clicks after that, nor update database (looking @ console).
index.html.haml
.votes - if current_user.liked? skit = link_to unlike_skit_path(skit), method: :get, remote: true, class: "unlike-post" .upvote %span.upvote-link %i.fa.fa-caret-up .vote-count= skit.votes_for.size - else = link_to like_skit_path(skit), method: :get, remote: true, class: "like-post" .upvote %span.upvote-link %i.fa.fa-caret-up .vote-count= skit.votes_for.size
routes.rb
resources :skits resources :challenges member "like", to: "skits#like" "unlike", to: "skits#unlike" end end
unlike.js.erb
$('.unlike-post').bind('ajax:success', function(){ $(this).find('.vote-count').html('<%= escape_javascript @skit.votes_for.size.to_s %>'); });
like.js.erb
$('.like-post').bind('ajax:success', function(){ $(this).find('.vote-count').html('<%= escape_javascript @skit.votes_for.size.to_s %>'); });
skits_controller.rb
def @skit.liked_by current_user respond_to |format| format.html { redirect_to skits_path, notice: 'successfully voted!' } format.js { render layout: false } end end def unlike @skit.unliked_by current_user respond_to |format| format.html { redirect_to skits_path, notice: 'successfully voted!' } format.js { render layout: false } end end
edit
after applying bottom, doesn't save database:
when saves database:
to add @max
's comment, you'll want @ drying code (using http verbs
, actions
accordingly):
# config/routes.rb resources :skits resources :challenges match :like, via: [:post, :delete], on: :member #-> url.com/skits/:id/like end # app/controllers/skits_controller.rb class skitscontroller < applicationcontroller def @skit.liked_by current_user if request.post? @skit.unliked_by current_user if request.delete? respond_to |format| format.html { redirect_to skits_path, notice: 'successfully voted!' } format.js #-> format.js doesn't render layout anyway end end end
you'll able use following:
#app/views/skits/index.html.erb <%= render @skits %> #app/views/skits/_skit.html.erb .votes - method = current_user.liked?(skit) ? :post : :delete = link_to skit_like_path(skit), method: method, remote: true, id: skit.id .upvote %span.upvote-link %i.fa.fa-caret-up .vote-count= skit.votes_for.size
solution
in regards problem of updating, you'll want make sure you're updating correct element through js.erb
:
#app/views/skits/like.js.erb $("#<%=j @skit.id %>").find(".vote-count").html('<%=j @skit.votes_for.size.to_s %>');
you don't need bind above code ajax:success
-- calling format.js
run code @ end of request. although may need tweaking, should work.
Comments
Post a Comment