Gon variable ne passant pas à js de rails contrôleur lors de la demande Ajax

Question

J'essaye de créer un site de pari de jackpot (juste comme un défi). J'ai une méthode dans mon contrôleur pour mettre à jour le pot quand un utilisateur ajoute de l'argent au pot. Je montre le total du pot sur la page d'accueil et je voudrais le mettre à jour avec Ajax dès que quelqu'un ajoute de l'argent au pot. J'utilise le gem gon pour passer des variables telles que le total du pot de mon contrôleur à mon javascript. Cela fonctionne quand la page est rechargée mais pas quand la méthode de mise à jour est appelée avec ajax.

Heres mon 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: (dans l'URL le: id est codé en dur pour l'instant)

$("#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") 
     } 
    }); 

});

Cette met à jour la barre de progression de beigne pour le pot

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

bouton pour placer pari: (montant également hardcoded)

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

Je suis assez nouveau sur les rails et surtout javascript/ajax donc Toute aide serait appréciée. Merci!

Answer 1

Dans le contrôleur, répondre simplement JSON:

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

dataType lors Spécifiez l'affichage avec $.ajax. Notez que les nouvelles données sont bieng passées à la fonction de succès, donc ce n'est pas gon.pot, mais data.pot. `Console.log (" Pot size: "+ gon.pot);` se comporte-t-il comme prévu en affichant la valeur du pot mise à jour?

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