🐕
Laravel Filamentで条件に応じて確認モーダルを表示する
Laravel FilamentのForm Builderで保存する際に特定条件でのみモーダルを表示したいケースがあったため方法を纏めてみました。
バージョン
- Laravel Filament v3
やりたいこと
-
商品(Product)の登録情報を編集する機能があり、保存時にモーダルを表示する。
-
条件に合う場合のみモーダルを表示する(今回は在庫が0のとき)
-
今回は既に下記コマンドでProductResourceやEditProductなどが作成済みであることを前提とします。
php artisan make:filament-resource Product
実装手順
確認モーダルを表示する
- 保存ボタン押下時にモーダルを表示するには、まず保存時のActionを変更可能にする必要があります。
- EditProductクラスの継承元であるEditRecordの
getSaveFormAction()
で保存ボタンを返しているため、こちらをオーバーライドします。
// EditProductに追加
protected function getSaveFormAction(): Action
{
return Action::make('save')
->label(__('filament-panels::resources/pages/edit-record.form.actions.save.label'))
->submit('save')
->keyBindings(['mod+s']);
}
- 次にボタン押下時にsubmitしないよう
submit('save')
を削除し、requiresConfirmation()
を追加して確認モーダルが表示されるようにします。
protected function getSaveFormAction(): Action
{
return Action::make('save')
->label(__('filament-panels::resources/pages/edit-record.form.actions.save.label'))
// submit('save')を削除
// requiresConfirmation()を追加
->requiresConfirmation()
->keyBindings(['mod+s']);
}
- 最後に確認モーダルの確定ボタン押下時にsubmitされるよう
action()
を追加します。
protected function getSaveFormAction(): Action
{
return Action::make('save')
->label(__('filament-panels::resources/pages/edit-record.form.actions.save.label'))
->requiresConfirmation()
// 追加
->action(fn() => $this->save())
->keyBindings(['mod+s']);
}
確認モーダルを表示しない条件を設ける
-
modalHidden()
を使用することで確認モーダルを表示しないでそのまま保存させることができます。 - ここでは入力された在庫数(count)が0より多い場合は表示しないように設定しています。
protected function getSaveFormAction(): Action
{
return Action::make('save')
->label(__('filament-panels::resources/pages/edit-record.form.actions.save.label'))
->requiresConfirmation()
->action(fn() => $this->save())
// 追加
->modalHidden(fn() => $this->data['count'] > 0)
->keyBindings(['mod+s']);
}
Discussion