Javascript vote act_as_votable

Question

I have a rails application in which my message model has comments and comments are voted. I am using act_as_votable.

I currently have a vote on working comments. Now I am trying to implement some javascript so that the page does not refresh every time someone votes for a comment so that the vote passes.

Here is what I had (worked):

In my comments the controller:

  def upvote_post_comment
  @post = Post.find(params[:post_id])
  @comment = @post.comments.find(params[:id])
  @comment.liked_by current_user

  respond_to do |format|
    format.html {redirect_to :back}
  end
end

And in my opinion:

<% if user_signed_in? && current_user != comment.user && !(current_user.voted_for? comment) %>


<%= link_to image_tag(‘vote.png'), like_post_comment_path(@post, comment), method: :put %> <a>
<%= "#{comment.votes.size}"%></a>


<% elsif user_signed_in? && (current_user = comment.user) %>

<%= image_tag(‘voted.png')%><a><%= "#{comment.votes.size}"%></a>

<% else %>

<%= image_tag(‘voted.png')%><a><%= "#{comment.votes.size}"%></a>
<% end %>

And here is what I now have:

In my comments the controller:

 def upvote_post_comment
 @post = Post.find(params[:post_id])
 @comment = @post.comments.find(params[:id])
 @comment.liked_by current_user

respond_to do |format|
format.html {redirect_to :back }
format.json { render json: { count: @comment.liked_count } }
end
end

And in my opinion:

<% if user_signed_in? && current_user != comment.user && !(current_user.voted_for? comment) %>


    <%= link_to image_tag(‘vote.png'), like_post_comment_path(@post, comment), method: :put, class: 'vote', remote: true %> 
<a><%= "#{comment.votes.size}"%></a>


  <script>

    $('.vote')
  .on('ajax:send', function () { $(this).addClass('loading'); })
  .on('ajax:complete', function () { $(this).removeClass('loading'); })
  .on('ajax:error', function () { $(this).after('<div class="error">There was an issue.</div>'); })
  .on('ajax:success', function (data) { $(this).html(data.count); });

    </script>


  <% elsif user_signed_in? && (current_user = comment.user) %>

  <%= image_tag(‘voted.png')%><a><%= "#{comment.votes.size}"%></a>


  <% else %>

  <%= image_tag(‘voted.png')%><a><%= "#{comment.votes.size}"%></a>


    <% end %>

This shows me the error message: "There was a problem"

And when I refresh the page, I see that the vote has passed, and I see this in my terminal:

Started PUT "/1/comments/1/like" for 127.0.0.1 at 2014-04-06 18:54:38 -0400
Processing by CommentsController#upvote_post_comment as JS
  Parameters: {"post_id"=>"1", "id"=>"1"}

Javascript? , , vote.png?

Answer 1

, JS.

Processing by CommentsController#upvote_post_comment as JS

data: { type: :json } link_to, JSON, ,

<%= link_to image_tag('vote.png'), like_post_comment_path(@post, comment), method: :put, class: 'vote', remote: true, data: { type: :json } %> 

, , JSON Javascript.

- .

,

format.json { render json: { count: @comment.likes.size } }

JS ,

.on('ajax:success', function(e, data, status, xhr) { $(this).html(data.count); });