Question

我是ruby的新手，我只是玩了一个演示应用程序。我已经包含了gem的act_as_votable，它的效果非常好，除了一个事实，我把它丢失了...... ajax。一直刷新页面有点单调，所以我“试着”实现ajax，但没有运气:(。经过两个小时的资源后我觉得我不能再做了什么。我需要帮助实现ajax on向下和向上投票。非常感谢。

这是我的代码：

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（在条目文件夹中）

<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（在条目文件夹中）

$(".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

我对rails有点新，所以任何帮助。非常感谢!! 感谢

Answer 1

Finnaly我已经设法让它发挥作用（充当可投票的宝石，投票现在是ajax）。我会分享它，因为有人和我有同样的问题。

routes.rb：

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

entries_controller.rb（在我的例子中）：

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（部分）：

<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 %>');
});

这就是全部。希望我可以帮助那些需要帮助的人。欢呼声。

Answer 2

这是我的解决方案。项目：用户可以创建帖子（debat），其他用户可以使用按钮进行upvote和downvote。

有什么不同：

当用户点击时，ajax刷新downvoteS计数和upvotes计数。我在我的javascript文件中使用.text代替.html。我没有使用部分，我将所有代码放在debat.html.erb中。我为每个按钮创建了具有span和变量id的特定类，因为所有按钮同时更改

我的routes.rb是一样的：

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（只有带有2个按钮的部分）

 <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%>);

});

希望它有所帮助！

作为可投票的Ajax失败

2 个答案: