6月6日（火）1、2コマ目

今日、やったこと

1画面に複数ボタン

今日のホワイトボード

パターン1　同じ機能のボタンが複数ある

各商品の選択ボタンをクリックすると、選択商品の詳細情報が表示される。

選択ボタンは複数あるが、同じ機能のボタン。

図　各商品を選択するためのボタンあり

Program.cs

前と同じ。Sessionオブジェクトが使えるように。

SessionExtentions.cs

前と同じ。 

Item.cs

商品情報受け渡し用クラス。

Index.cshtml.cs

どの選択ボタンをクリックしても、OnPost()が実行される。

よって、OnPost()ではどのボタンが押されたかを判別する必要がある。

<button>タグにもname属性とvalue属性がある。value属性でどの商品がクリックされたかがわかる。

Index.cshtml

全選択ボタンは同じ<form>タグ内に。

その２　異なる機能のボタンが複数ある

機能が異なるため、クリックされるタイミングも異なる。

どのボタンをクリックしてもOnPost()が実行される。

OnPost()ではどのボタンがクリックされたかで処理が異なるため、クリックされたボタンを判別する必要がある。

図　カートへボタンと削除ボタンの2種類のボタンがある

Program.cs

前と同じ。Sessionオブジェクトが使えるように。

SessionExtentions.cs

前と同じ。 

Item.cs

商品情報受け渡し用クラス。

Index.cshtml.cs

OnPost()の引数itemidは選択リストにて選択された商品のIDがセットされる。

選択リストは未選択でも一番上の要素が選択されたことになる点に注意。

Index.cshtml

次回は

練習問題（Razorページ 課題5)の解説をします。

多分、テストをします。