0

为了引入问题,应用程序中的用户可以对提交的文章投赞成票/反对票。我通过以下方式定义了两条非宁静路线:

get 'vote_up/:storage_id' => 'home#vote_up', :as => 'vote_up'
get 'vote_down/:storage_id' => 'home#vote_down', :as => 'vote_down'

<%= link_to image_tag("up1.png"), vote_up_path(post.storage_id), :class => "vote_up" %>
<%= link_to image_tag("down1.png"), vote_down_path(post.storage_id), :class => "vote_down", :remote => true %>

所以第一个链接不会使用:remote => true,第二个会。

当我说“标准”Ajax 时,我将使用它来进行 vote_up 操作,我的意思是:

#家庭控制器内部

def vote_up
  storage = Storage.find(params[:storage_id])
  storage.vote.count += 1
  storage.vote.save

  render :json => {:votes => storage.vote.count, :id => params[:storage_id]}
end

所以当用户点击 vote_up 按钮时,浏览器会发送以下 ajax 请求:
# assets/javascript/home.js

$(function() {
  $('.vote_up').click(function() {
    $.get($(this).attr('href'), function(data) {
      var selector = "#like_counter-" + data.id;
      $(selector).html(data.votes);
    });

    return false;
  });
});

:remote=>true我的问题是这种方式和下面描述的方式有什么区别。从技术角度看,什么都没有?我只能假设这:remote => true是首选,因为它更“面向轨道”?

#家庭控制器内部

def vote_down
    @storage = Storage.find(params[:storage_id])

    @storage.vote.count -= 1
    @storage.vote.save

    respond_to do |format|
      format.js
    end
  end

# views/home/vote_down.js.erb

$(function() {
    var selector = "#like_counter-" + '<%= @storage.id %>';
    $(selector).html('<%= @storage.vote.count %>');
});

在所有示例中,选择器是跨度元素,持有每篇文章(存储)的投票数。

4

0 回答 0