Contenu connexe
Similaire à Hokuriku.NET ASP.NET MVC 入門 2 回目 1.編集機能を実装 (20)
Hokuriku.NET ASP.NET MVC 入門 2 回目 1.編集機能を実装
- 4. 今日行うこと イメージ
Controlller
Model
View
- 5. 今日行うこと イメージ
Azure
編集機能
Controlller NuGet
URL ルーティング Model
JavaScript
View データの表示
ビュー開発
- 10. 1.編集機能の実装
流れの確認
アクセス GET /Cutomer/Edit/1
編集画面のHtml
入力
POST /Customer/Edit/1
DB登録
302 リダイレクト /Customer/List
GET /Customer/List
一覧画面のHtml
一覧画面確認
- 18. 1.編集機能の実装
説明 データの表示 2
①Model として指定する
コントローラで
View メソッドの引数に、ビューへ渡したいデータを指定します。
ビューで
ビューある、Edit.cshtml ファイルに、Model の型を宣言します。
このように宣言することで、型情報を利用して
コードを記述することができます。
- 20. 1.編集機能の実装
説明 Html コントロール 1
編集画面で、既存の顧客データを、テキストボックス
で表示しました。
テキストボックスやチェックボックス等、
Html コントロールに値を入れて表示したい時は、
コントローラ側で、
と、Model をわたし、
ビュー側で、
と書くことで表示できます。
- 21. 1.編集機能の実装
説明 Html コントロール 2
顧客IDを、隠しコントロールに入れ、POST 送信時に送信される
ようにしました。
隠しコントロールについて
画面には表示したくないけど、POST 時に値を送信したい時に
使用します。(値はソースから確認できるので注意)
- 24. 1.編集機能の実装
流れの確認
アクセス GET /Cutomer/Edit/1
編集画面のHtml
入力 +
POST /Customer/Edit/1 グループの選択項目と、
性別の選択項目
を表示する必要がある。
テキストボックスとや、チェックボックスと同じ、
セレクトリストを使って表示する。
- 38. 1.編集機能の実装 まとめ
編集機能より、ASP.NET MVC の基本の流れをおさらいしました。
データの表示方法を確認しました。
ViewData, ViewBag
Return View(model);
Html コントロールを使ったデータの表示方法を確認しました。
セレクトリストの使い方も確認しました。
TempData を使えば、リクエスト間でデータを参照できることを
確認しました。
- 39. 1.編集機能の実装 まとめ
編集機能 TempData
Controlller
Model
ActionLink ViewData, ViewBag
View
Html.TextBoxFor(..)
Html.DropDownListFor(..)