前回で、カートにアイテムを追加してからの一連の流れができました。
しかしながら、カートは現在、scaffoldに基づいた showで表示しているかと思います。
お察しの通りこれは親切とはいえません。ストアページのどこかに出すのが自然でしょう。
scaffoldをした時に _form.html.erb というファイルが生成されたかと思います。
これはrailsがそのモデルに基づいたフォームを自動生成しているものですが、同様にして、レイアウトでないものもパーシャルとしてrenderすることができます。
carts/_cart.html.erb を作成します。
showの中身をそちらに移動します。
そして、carts/show.html.erbを
<%= render @cart %>
にします。
ブラウザで開いて確認してみましょう。
次に、実際にストアページにも表示させるのですが、store#index ではまだカートの情報がないので
include CurrentCart before_action :set_cart def index ....
としましょう。
・ストアページに実際に配置しましょう
・line_itemもパーシャル化しましょう
・追加ボタンを押した時にストアページにとどまるようにしましょう。
・カートが空時は表示されないようにしましょう。
現在はカートに追加を押す度にページが更新されています。
AJAXという非同期通信を用いてこの更新をなくすことができます。
追加ボタンのパラメータに
remote: true
line_items_controller.rbのcreateのレスポンスに
format.js
を追加し、
views/line_items/ に create.js.erb を作成し、
$('#cart').html("<%=j render(@cart) %>");
と、します。
こうすることで、rubyが出力した@cartの結果を含んだjavascriptレスポンスが渡され、画面に表示されます。
・jQuery UIを用いて、追加時になんらかのエフェクトが出るようにしましょう。
・Ajaxで送信されていることをテストしましょう。