Act as a Votable Ajax Fail

Question

I am new to ruby ​​and I just played with the demo app. I have included the pearl act_as_votable and it works great, except for the one fact that I am losing it ... ajax. Updating all the time of the page is a bit tedious, so I "tried" to implement ajax, but no luck :( After two hours of the resource, I think I can’t do anything else. I need help implementing ajax on up and down. Thank you very much.

Here is my code:

entries_controller.rb

def upvote @entry = Entry.find(params[:id]) unless current_user.voted_for? @entry @entry.vote_total = @entry.vote_total + 1 @entry.save @entry.upvote_by current_user else flash[:danger] = 'Sorry!! You had allready voted this entry!' end redirect_to :back end def downvote @entry = Entry.find(params[:id]) unless current_user.voted_for? @entry @entry.vote_total = @entry.vote_total + 1 @entry.save @entry.downvote_by current_user else flash[:danger] = 'Sorry!! You had allready voted this entry!' end redirect_to :back end 

_entry.html.erb (in the notes folder)

 <aside class="vote-count bind-<%= entry.id %>"> <%= link_to like_entry_path(entry), :remote => true, method: :put, class: 'vpos' do %> <i class="fa fa-thumbs-up"></i> <%= entry.get_upvotes.size %> <% end %> <%= link_to dislike_entry_path(entry), :remote => true, method: :put, class: 'npos' do %> <i class="fa fa-thumbs-down"></i> <%= entry.get_downvotes.size %> <% end %> </aside> 

upvote.js.erb (in the notes folder)

 $(".bind-<%=entry.id%>").html('<%=escape_javascript entry.get_upvotes.size %>'); 

routes.rb

 resources :entries, only: [:index, :show, :new, :create, :destroy] do member do put 'like', to: 'entries#upvote' put 'dislike', to: 'entries#downvote' end end 

I'm a little new to rails, so I don’t understand anything. I would really appreciate it !! Thanks

Answer 1

Finnaly I managed to get it to work (acts as a voted gem, voices are now ajax). I am going to share it with the fact that someone has the same problem as me.

routes.rb:

 put 'like', to: 'entries#upvote' put 'dislike', to: 'entries#downvote' 

entries_controller.rb (in my case):

 def upvote @entry = Entry.find(params[:id]) respond_to do |format| unless current_user.voted_for? @entry format.html { redirect_to :back } format.json { head :no_content } format.js { render :layout => false } @entry.vote_total = @entry.vote_total + 1 @entry.save @entry.upvote_by current_user else flash[:danger] = 'You allready voted this entry' format.html { redirect_to :back } format.json { head :no_content } format.js end end end def downvote @entry = Entry.find(params[:id]) respond_to do |format| unless current_user.voted_for? @entry format.html { redirect_to :back } format.json { head :no_content } format.js { render :layout => false } @entry.vote_total = @entry.vote_total + 1 @entry.save @entry.downvote_by current_user else flash[:danger] = 'You allready voted this entry' format.html { redirect_to :back } format.json { head :no_content } format.js end end end 

_entry.html.erb (partial):

 <aside class="vote-count bind-<%= entry.id %>"> <%= link_to like_entry_path(entry), :remote => true, method: :put, class: 'vpos' do %> <i class="fa fa-thumbs-up"></i> <span class="vcount-<%= entry.id %>"><%= entry.get_upvotes.size %></span> <% end %> <%= link_to dislike_entry_path(entry), :remote => true, method: :put, class: 'npos' do %> <i class="fa fa-thumbs-down"></i> <span class="ncount-<%= entry.id %>"><%= entry.get_downvotes.size %></span> <% end %> </aside> 

upvote.js.erb:

 $('.vpos').bind('ajax:success', function() { $('.vcount-<%= @entry.id %>').html('<%=escape_javascript @entry.get_upvotes.size.to_s %>'); }); 

downvote.js.erb:

 $('.npos').bind('ajax:success', function() { $('.ncount-<%= @entry.id %>').html('<%=escape_javascript @entry.get_downvotes.size.to_s %>'); }); 

It's all. Hope I can help someone who needs a hand. Greetings.

Answer 2

Here is my solution. Project: the user can create a message (debat), and other users can raise and lower the level using the buttons.

What else:

ajax updates downvoteS counting and upvotes counting simultaneously when user clicks. I used .text instead of .html in my javascript files. I did not use partial, I put all my code in debat.html.erb. I created a special class for each button with a range and a variable identifier, because all the buttons changed at the same time

My .rb routes are the same:

 resources :debats do member do put "like", to: "debats#upvote" put "dislike", to: "debats#downvote" end end 

dabats_controller.rb:

 def upvote @debat = Debat.find(params[:id]) @debat.upvote_by current_user respond_to do |format| format.html {redirect_to :back } format.json { render json: { count: @debat.liked_count } } format.js { render :layout => false } end end def downvote @debat = Debat.find(params[:id]) @debat.downvote_by current_user respond_to do |format| format.html {redirect_to :back } format.json { render json: { count: @debat.disliked_count } } format.js { render :layout => false } end end 

debat.html.erb (only two-button part)

  <div class="large-1 columns count"> <span class= "like-<%= debat.id %>"> <%= link_to like_debat_path(debat), method: :put, remote: true, class: 'like' do %> <div class="upcount"><i class="fa fa-angle-up"></i></div> <div class="ouicount up-<%= debat.id %>"><%= debat.get_upvotes.size %></div> <div class="oui">Oui</div> <%end%> </span> <span class= "dislike-<%= debat.id %>"> <%= link_to dislike_debat_path(debat), method: :put, remote: true, class: 'dislike' do %> <div class="non">Non</div> <div class="noncount down-<%= debat.id%>"> <%= debat.get_downvotes.size %></div> <div class="downcount"><i class="fa fa-angle-down"></i></div> <% end %> </span> </div> 

upvote.js.erb

 $('.like').bind('ajax:success', function() { $('.up-<%= @debat.id %>').text(<%= @debat.get_upvotes.size%>); $('.down-<%= @debat.id %>').text(<%= @debat.get_downvotes.size%>); }); 

downvote.js.erb

 $('.dislike').bind('ajax:success', function() { $('.up-<%= @debat.id %>').text(<%= @debat.get_upvotes.size%>); $('.down-<%= @debat.id %>').text(<%= @debat.get_downvotes.size%>); }); 

Hope this helps!