2. 削除ボタンの準備
目標
:削除ボタン(フォーム送信)を作る
:(削除後の)一覧表示された画面を作る
削除機能の手順を確認しよう
削除フォーム送信される→Node.jsを介して削除実行される→削除後の一覧画面が表示される
このように覚える。
削除後のリダイレクト機能もあるので、前回の復習を忘れずに。
ルーティングを用意しよう
目的:メモ削除のためのルーティングを作るため
手順1
app.post('/delete', (req, res) => {
ここに処理項目を書く
});
point
--
メモを削除する = データベースを変更する
このように覚える
削除ボタンを用意しよう
手順2
-
メモを削除するためのボタンを一つずつ作る
-
<form></form>属性をつかう
-
form属性の中にaction属性、method属性を追加する
(ルーティングによる。なのでルーティングに合わせて指定すること)
フォームの使いどころ
point
postを使ってリクエストするときはフォームをつかう
Ex.フォームの型をマナブ
<form action="/delete" method="post">
<input type="submit" value="削除"
</form>
このように書く
リダイレクトしよう
なぜリダイレクトをするのか
一覧画面を表示させるため処理する必要があるため
リダイレクト処理する方法
res.redirect('/index');
});
このように書く
演習問題
・メモ削除ルーティングについて
res.redirectの方法はそもそもapp.js内のコードに書いてある。
/indexの時も同じ書き方なので、真似して書けばOK。概念のみ理解しておこう。
・/index /delete それぞれ/(スラッシュ)をつけるのを忘れないようにする
・削除ボタンを作る際、送信先は/delete。deleteの通信方法はpost
参考:
今回は以上になります。お疲れ様でした。