2016-11-08 2 views
-1

geklickt Wenn Benutzer klickt Button „In den Warenkorb“, muss ich die Nummer von eins in meiner navbar div erhöhen, um zu zeigen, wie viele Produkte in seinem Warenkorb sind.Rails 5, Ajax, jQuery - Erhöhung Zahl, wenn die Taste

Also, meine Taste hat remote: true

gesetzt

Und navbar hat ein div mit id Zählung.

Funktion Ich benutze Zahl zu erhöhen:

$('#count').html(function(i, val) { return val*1+1 }); 

Aber wenn ich Seite neu geladen wird dieser Wert verschwindet. Wie kann ich diesen Wert bis zu etwas Aktion, wie "Kasse" bleiben?

Oder vielleicht gibt es eine bessere Art und Weise für das?

+1

Nun, in diesem Satz Artikel im Warenkorb Zähler unter ur_controller erstellen, müssen Sie irgendwo den Wert speichern, wie in DB oder in einem Cookie. – Vucko

Antwort

0

a Erstellen Modellmethode oder Hilfsmethode für den Benutzer, um die Anzahl der aktiven Einkaufswagenartikel zu ermitteln. so dass es auch den genauen Wert liefert.

Zum Beispiel:

class User < ApplicationRecord 
has_many :cart_items 
def active_cart_items 
    return self.cart_items.group_by(&:product_id).count #.where(status:active) (optional) 
end 
end 

ur_action.js.erb

$('#count').html("<%[email protected]_cart_items%>") 
+0

Ich füge deinen Kommentar als Antwort hinzu, da du die Syntax gezeigt hast, wie Ruby-Teile in JS eingegeben werden. Das wusste ich nicht (ja, jetzt sieht es einfach aus ...). Aber ich werde immer noch daran arbeiten müssen, da ich diese Methode verwende, um ein neues cart_item hinzuzufügen: 'def add_product (product) current_item = cart_items.find_by (product_id: product.id) wenn current_item current_item.quantity + = 1 sonst current_item = cart_items.build (product_id: product.id) Ende current_item end' –

+0

so, wenn Benutzer mehr gleichen cart_items hinzufügt, werden sie nicht –

+1

ah, meinen Tag etwas frische Luft multipliziert werden und Schienen Konsole gemacht. Die Antwort ist einfach: @ cart.cart_items.map {| i | ich [: Menge]} .sum –

0

Sie müssen die Artikel in der Datenbank speichern. Auf Schaltfläche anklickt, ein Ajax (remote: true) wird gefeuert, die den Warenkorb Zahl in der Datenbank aktualisiert & die entsprechende Datei js.erb zurückkehren wird, die die Zählung in der navbar aktualisieren