javascript - 充当 votable javascript 投票按钮

Question

我正在使用一个名为 acts_as_votable 的 gem让我的模型可以投票。

目前一切正常。

但是每次有人为帖子投票时，页面都必须刷新。如何在不刷新页面的情况下进行投票。我可以添加一个简单的 javascript 吗？

这是我的 Controller 中的内容:

def vote
  @post = Post.find(params[:post_id])
  @post.liked_by current_user
  respond_to do |format|
    format.html {redirect_to :back }
  end
end

这是我的观点:

 <%= link_to “like post", like_post_path(@post), method: :put %>

Answer 1

一个非常简单的版本可能是这样的:

ruby

def vote
  @post = Post.find(params[:post_id])
  @post.liked_by current_user
  respond_to do |format|
    format.html {redirect_to :back }
    format.json { render json: { count: @post.liked_count } }
  end
end

HTML

<%= link_to 'like', vote_path(@post), class: 'vote', remote: true, data: { type: :json } %>

JS

$('.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); });

这是一个非常初级的版本，展示了基本方法，但它有一些明显的缺陷:

• 无法“取消投票”
• “正在加载”指示器并不是很好的用户体验；使用 JS，我们始终可以显示用户的当前状态并在后台处理与服务器的同步
• View 中的任何 HTML 缓存都会破坏它