javascript - Ajax 请求期间 Gon 变量未从 Rails Controller 传递到 js

Question

我正在尝试创建一个累积奖金投注网站(只是作为一个挑战)。当用户向底池添加资金时，我的 Controller 中有一个方法可以更新底池。我在主页上显示底池总额，并希望在有人向底池中添加资金时立即使用 Ajax 进行更新。我使用 gon gem 将变量(例如底池总额)从我的 Controller 传递到我的 javascript。它在页面重新加载时有效，但在使用 ajax 调用 update 方法时无效。

这是我的 PagesController:

def home
  @jackpot = Jackpot.last
  gon.pot = @jackpot.pot
end

JackpotsController:

def update
  @jackpot = Jackpot.find(params[:id])
  if params.has_key?(:amount)
    @jackpot.update(pot: @jackpot.pot + params[:amount].to_f)
    gon.pot = @jackpot.pot
  end
  respond_to do |format| 
    format.js
  end
end

Javascript:(在 url 中，:id 目前是硬编码的)

$("#bet-btn").click(function() {
   $.ajax({
        type: "POST",
        url: "/jackpot/update/21",
        datatype: "json",
        success: function() {
          console.log("Pot size: " + gon.pot);
          updatePot();
        },
        error: function() {
          console.log("error")
        }
    });

});

这会更新锅的 donut 进度条

function updatePot() {
  updateDonutChart('#jackpot-donut', gon.pot , true); 
}

下注按钮:(金额也是硬编码的)

 <%= link_to "Place Bet", update_pot_path(@jackpot, :amount => 
 0.1), method: :post,:remote => true, id: "bet-btn", class: "btn btn-info btn-lg" %>

我对 Rails 特别是 javascript/ajax 还很陌生，所以任何帮助将不胜感激。谢谢!

Answer 1

在 Controller 中，只需响应 JSON:

respond_to do |format|
  format.json { render json: { pot: @jackpot.pot } }
end

使用$.ajax发布时指定数据类型。请注意，新数据已传递给 success 函数，因此它不是 gon.pot，而是 data.pot。

$.ajax({
  dataType: "json",
  url: url,
  data: data,
  success: function(data) {
    console.log('pot', data.pot);
  }
});