Laravel：削除実行前に確認画面を表示させる

Laravel：削除実行前に確認画面を表示させる

自作システムがDBとしてある程度動作するところまでたどり着きました。

実際に使いだすと欲しい『うっかり削除の防止機能』
と言うことで、【削除ボタンクリック = 即削除】をやめワンクッション置こうという施策についてです。

方法を大別すると2パターン

1番は、例えば『アコーディオンの中に削除ボタンを配置し、オープンした時だけ見える』と言う方法があります。
まぁ、どちらをよく見るかと言われれば、2番のウィンドで許可ですよね。

簡単に済ませるなら alert でテキスト伝達事項がある場合はモーダルで

変更許諾を行うウィンドは 単純なalert か モーダルウィンドで専用テキストとともに実装するかが多いようです。

簡単に作れて使いまわせるのは【alert】です。

クリックアクションでお知らせの様なものを一緒に表示させたいのであれば、モーダルページを1つづつ作る方法もありです。「このボタンはこんなアクションします」と言った説明なんかはこの方法で実装しやすいです。

今回やりたいのは【削除】の判断処理。
数も多いので「標準型を作って使いまわしたい」と言うことで単純なアラートを選択しました。

実際に書いたコード

■public\js\app.js

■resources\views\hogehoge.bladelphp

ちょっと解説

app.js にDeleteボタンをクリックしたときに呼び出すファンクションを記載します。

window.confirmはメッセージと、OK と キャンセルの 2 つのボタンを持つモーダルダイアログを表示します。
if(!window.confirm() で【キャンセル が選択された時】という意味になります。※！で否定しているから

つまりは『キャンセルされたら[キャンセルされました]を表示。そうじゃなかったらsubmitしてね』となります。

後はこのfunctionをクリックアクションとして削除ボタンに[ onClick=”delete_alert(event);return false;” ] と配置していけばjsの使いまわしOKです。

まとめ

色々調べると、モーダル表示でアクションを促すのは止めた方が良い等の記事も見当たりました。

知り合いのエンジニアの方に聞いたところ「あまり神経質にならなくてもいいパート」であるとの答えでした。

だったら簡単で分かりやすい方が良いですよね。