模态框
简介
Action 可能会在运行前要求额外确认或者用户输入。你可以在 Action 执行之前打开模态框实现该功能。
确认模态框
使用 requiresConfirmation() 方法,你可以在 Action 运行之前请求确认。这对于破坏性操作,比如删除记录,特别有用。
use App\Models\Post;
use Filament\Actions\Action;
Action::make('delete')
->action(fn (Post $record) => $record->delete())
->requiresConfirmation()

NOTE
如果使用 url() 代替 action(),那确认模态框将会不可用。相反,你应该在 action() 方法内,重定向 URL。
NOTE
Confirmation modals use the alertdialog ARIA role instead of dialog, so screen readers announce them as alerts and automatically read the modal's description when they open.
控制模态框内容
自定义模态框标题、描述及提交按钮标签
你可以自定义模态框的标题、描述及提交按钮标签:
use App\Models\Post;
use Filament\Actions\Action;
Action::make('delete')
->action(fn (Post $record) => $record->delete())
->requiresConfirmation()
->modalHeading('Delete post')
->modalDescription('Are you sure you\'d like to delete this post? This cannot be undone.')
->modalSubmitActionLabel('Yes, delete it')

在模态框中渲染 Schema
Filament 允许你在模态框中渲染 Schema,它允许你渲染任何可用组件以搭建 UI。通常而言,在 Schema 中创建一个在运行 Action 之前从用户那里收集额外信息的表单很有用,不过你也可以渲染其他任何 UI:
use Filament\Actions\Action;
use Filament\Forms\Components\Checkbox;
use Filament\Forms\Components\Select;
use Filament\Forms\Components\TextInput;
use Filament\Infolists\Components\TextEntry;
use Filament\Schemas\Components\Section;
Action::make('viewUser')
->schema([
Grid::make(2)
->schema([
Section::make('Details')
->schema([
TextInput::make('name'),
Select::make('position')
->options([
'developer' => 'Developer',
'designer' => 'Designer',
]),
Checkbox::make('is_admin'),
]),
Section::make('Auditing')
->schema([
TextEntry::make('created_at')
->dateTime(),
TextEntry::make('updated_at')
->dateTime(),
]),
]),
])
除了允许静态值之外,schema() 方法也可以接受函数来动态计算它的值。你可以将多个 utility 作为参数注入到该函数中。
Learn more about utility injection.| Utility | Type | Parameter | Description |
|---|---|---|---|
| Action | Filament\Actions\Action | $action | The current action instance. |
| Arguments | array<string, mixed> | $arguments | The array of arguments passed to the action when it was triggered. |
| Data | array<string, mixed> | $data | The array of data submitted from form fields in the action's modal. It will be empty before the modal form is submitted. |
| Livewire | Livewire\Component | $livewire | The Livewire component instance. |
| Eloquent model FQN | ?string<Illuminate\Database\Eloquent\Model> | $model | The Eloquent model FQN for the current action, if one is attached. |
| Mounted actions | array<Filament\Actions\Action> | $mountedActions | The array of actions that are currently mounted in the Livewire component. This is useful for accessing data from parent actions. |
| Eloquent record | ?Illuminate\Database\Eloquent\Model | $record | The Eloquent record for the current action, if one is attached. |
| Schema | Filament\Schemas\Schema | $schema | [Actions in schemas only] The schema object that this action belongs to. |
| Schema component | Filament\Schemas\Components\Component | $schemaComponent | [Actions in schemas only] The schema component that this action belongs to. |
| Schema component state | mixed | $schemaComponentState | [Actions in schemas only] The current value of the schema component. |
| Schema get function | Filament\Schemas\Components\Utilities\Get | $schemaGet | [Actions in schemas only] A function for retrieving values from the schema data. Validation is not run on form fields. |
| Schema operation | string | $schemaOperation | [Actions in schemas only] The current operation being performed by the schema. Usually <code>create</code>, <code>edit</code>, or <code>view</code>. |
| Schema set function | Filament\Schemas\Components\Utilities\Set | $schemaSet | [Actions in schemas only] A function for setting values in the schema data. |
| Selected Eloquent records | Illuminate\Support\Collection | $selectedRecords | [Bulk actions only] The Eloquent records selected in the table. |
| Table | Filament\Tables\Table | $table | [Actions in tables only] The table object that this action belongs to. |

在模态框种渲染表单
你可以使用表单字段来创建自定义模态框表单。表单中的数据可以通过 action() 闭包中的 $data 数组获取:
use App\Models\Post;
use App\Models\User;
use Filament\Actions\Action;
use Filament\Forms\Components\Select;
Action::make('updateAuthor')
->schema([
Select::make('authorId')
->label('Author')
->options(User::query()->pluck('name', 'id'))
->required(),
])
->action(function (array $data, Post $record): void {
$record->author()->associate($data['authorId']);
$record->save();
})

使用现有数据填充表单
通过 fillForm() 方法,你可以使用现有数据填充表单:
use App\Models\Post;
use App\Models\User;
use Filament\Actions\Action;
use Filament\Forms\Components\Select;
Action::make('updateAuthor')
->fillForm(fn (Post $record): array => [
'authorId' => $record->author->id,
])
->schema([
Select::make('authorId')
->label('Author')
->options(User::query()->pluck('name', 'id'))
->required(),
])
->action(function (array $data, Post $record): void {
$record->author()->associate($data['authorId']);
$record->save();
})
fillForm() 方法也接受函数来动态计算填入表单的数据。你可以将各种 utility 作为参数注入到该函数中。
Learn more about utility injection.| Utility | Type | Parameter | Description |
|---|---|---|---|
| Action | Filament\Actions\Action | $action | The current action instance. |
| Arguments | array<string, mixed> | $arguments | The array of arguments passed to the action when it was triggered. |
| Data | array<string, mixed> | $data | The array of data submitted from form fields in the action's modal. It will be empty before the modal form is submitted. |
| Livewire | Livewire\Component | $livewire | The Livewire component instance. |
| Eloquent model FQN | ?string<Illuminate\Database\Eloquent\Model> | $model | The Eloquent model FQN for the current action, if one is attached. |
| Mounted actions | array<Filament\Actions\Action> | $mountedActions | The array of actions that are currently mounted in the Livewire component. This is useful for accessing data from parent actions. |
| Eloquent record | ?Illuminate\Database\Eloquent\Model | $record | The Eloquent record for the current action, if one is attached. |
| Schema | Filament\Schemas\Schema | $schema | [Actions in schemas only] The schema object that this action belongs to. |
| Schema component | Filament\Schemas\Components\Component | $schemaComponent | [Actions in schemas only] The schema component that this action belongs to. |
| Schema component state | mixed | $schemaComponentState | [Actions in schemas only] The current value of the schema component. |
| Schema get function | Filament\Schemas\Components\Utilities\Get | $schemaGet | [Actions in schemas only] A function for retrieving values from the schema data. Validation is not run on form fields. |
| Schema operation | string | $schemaOperation | [Actions in schemas only] The current operation being performed by the schema. Usually <code>create</code>, <code>edit</code>, or <code>view</code>. |
| Schema set function | Filament\Schemas\Components\Utilities\Set | $schemaSet | [Actions in schemas only] A function for setting values in the schema data. |
| Selected Eloquent records | Illuminate\Support\Collection | $selectedRecords | [Bulk actions only] The Eloquent records selected in the table. |
| Table | Filament\Tables\Table | $table | [Actions in tables only] The table object that this action belongs to. |
禁用所有表单字段
你可以使用 disabledForm() 方法,禁用模态框中的所有表单字段,确保用户不 能对其进行编辑:
use App\Models\Post;
use Filament\Actions\Action;
use Filament\Forms\Components\Textarea;
use Filament\Forms\Components\TextInput;
Action::make('approvePost')
->schema([
TextInput::make('title'),
Textarea::make('content'),
])
->disabledForm()
->action(function (Post $record): void {
$record->approve();
})

在模态框中渲染 Wizard
你可以在模态框中创建多步骤表单向导卡(wizard)。无需使用 schema(),可以定义 step() 字符串,并传入 Step 对象:
use Filament\Actions\Action;
use Filament\Forms\Components\MarkdownEditor;
use Filament\Forms\Components\TextInput;
use Filament\Forms\Components\Toggle;
use Filament\Schemas\Components\Wizard\Step;
Action::make('create')
->steps([
Step::make('Name')
->description('Give the category a unique name')
->schema([
TextInput::make('name')
->required()
->live()
->afterStateUpdated(fn ($state, callable $set) => $set('slug', Str::slug($state))),
TextInput::make('slug')
->disabled()
->required()
->unique(Category::class, 'slug'),
])
->columns(2),
Step::make('Description')
->description('Add some extra details')
->schema([
MarkdownEditor::make('description'),
]),
Step::make('Visibility')
->description('Control who can view it')
->schema([
Toggle::make('is_visible')
->label('Visible to customers.')
->default(true),
]),
])

在模态框内添加图标
使用 modalIcon() 方法,你可以在模态框中添加图标:
use App\Models\Post;
use Filament\Actions\Action;
Action::make('delete')
->action(fn (Post $record) => $record->delete())
->requiresConfirmation()
->modalIcon('heroicon-o-trash')
modalIcon() 方法也可以接受函数来动态计算它的值。你可以将各种 utility 作为参数注入到该函数中。
Learn more about utility injection.| Utility | Type | Parameter | Description |
|---|---|---|---|
| Action | Filament\Actions\Action | $action | The current action instance. |
| Arguments | array<string, mixed> | $arguments | The array of arguments passed to the action when it was triggered. |
| Data | array<string, mixed> | $data | The array of data submitted from form fields in the action's modal. It will be empty before the modal form is submitted. |
| Livewire | Livewire\Component | $livewire | The Livewire component instance. |
| Eloquent model FQN | ?string<Illuminate\Database\Eloquent\Model> | $model | The Eloquent model FQN for the current action, if one is attached. |
| Mounted actions | array<Filament\Actions\Action> | $mountedActions | The array of actions that are currently mounted in the Livewire component. This is useful for accessing data from parent actions. |
| Eloquent record | ?Illuminate\Database\Eloquent\Model | $record | The Eloquent record for the current action, if one is attached. |
| Schema | Filament\Schemas\Schema | $schema | [Actions in schemas only] The schema object that this action belongs to. |
| Schema component | Filament\Schemas\Components\Component | $schemaComponent | [Actions in schemas only] The schema component that this action belongs to. |
| Schema component state | mixed | $schemaComponentState | [Actions in schemas only] The current value of the schema component. |
| Schema get function | Filament\Schemas\Components\Utilities\Get | $schemaGet | [Actions in schemas only] A function for retrieving values from the schema data. Validation is not run on form fields. |
| Schema operation | string | $schemaOperation | [Actions in schemas only] The current operation being performed by the schema. Usually <code>create</code>, <code>edit</code>, or <code>view</code>. |
| Schema set function | Filament\Schemas\Components\Utilities\Set | $schemaSet | [Actions in schemas only] A function for setting values in the schema data. |
| Selected Eloquent records | Illuminate\Support\Collection | $selectedRecords | [Bulk actions only] The Eloquent records selected in the table. |
| Table | Filament\Tables\Table | $table | [Actions in tables only] The table object that this action belongs to. |
默认情况下,图标继承了 Action 按钮的颜色。你可以使用 modalIconColor() 方法自定义图标颜色:
use App\Models\Post;
use Filament\Actions\Action;
Action::make('delete')
->action(fn (Post $record) => $record->delete())
->requiresConfirmation()
->color('danger')
->modalIcon('heroicon-o-trash')
->modalIconColor('warning')
modalIconColor() 方法也可以接受函数来动态计算它的值。你可以将各种 utility 作为参数注入到该函 数中。
Learn more about utility injection.| Utility | Type | Parameter | Description |
|---|---|---|---|
| Action | Filament\Actions\Action | $action | The current action instance. |
| Arguments | array<string, mixed> | $arguments | The array of arguments passed to the action when it was triggered. |
| Data | array<string, mixed> | $data | The array of data submitted from form fields in the action's modal. It will be empty before the modal form is submitted. |
| Livewire | Livewire\Component | $livewire | The Livewire component instance. |
| Eloquent model FQN | ?string<Illuminate\Database\Eloquent\Model> | $model | The Eloquent model FQN for the current action, if one is attached. |
| Mounted actions | array<Filament\Actions\Action> | $mountedActions | The array of actions that are currently mounted in the Livewire component. This is useful for accessing data from parent actions. |
| Eloquent record | ?Illuminate\Database\Eloquent\Model | $record | The Eloquent record for the current action, if one is attached. |
| Schema | Filament\Schemas\Schema | $schema | [Actions in schemas only] The schema object that this action belongs to. |
| Schema component | Filament\Schemas\Components\Component | $schemaComponent | [Actions in schemas only] The schema component that this action belongs to. |
| Schema component state | mixed | $schemaComponentState | [Actions in schemas only] The current value of the schema component. |
| Schema get function | Filament\Schemas\Components\Utilities\Get | $schemaGet | [Actions in schemas only] A function for retrieving values from the schema data. Validation is not run on form fields. |
| Schema operation | string | $schemaOperation | [Actions in schemas only] The current operation being performed by the schema. Usually <code>create</code>, <code>edit</code>, or <code>view</code>. |
| Schema set function | Filament\Schemas\Components\Utilities\Set | $schemaSet | [Actions in schemas only] A function for setting values in the schema data. |
| Selected Eloquent records | Illuminate\Support\Collection | $selectedRecords | [Bulk actions only] The Eloquent records selected in the table. |
| Table | Filament\Tables\Table | $table | [Actions in tables only] The table object that this action belongs to. |
自定义模态框内容对齐方式
默认情况下,模态框内容对齐到起始位置,或者如果模态框宽度是 xs 或 sm,则居中对齐。如果你想修改模态框内容的对齐方式,可以在 modalAlignment() 中传入 Alignment::Start 或者 Alignment::Center:
use Filament\Actions\Action;
use Filament\Support\Enums\Alignment;
Action::make('updateAuthor')
->schema([
// ...
])
->action(function (array $data): void {
// ...
})
->modalAlignment(Alignment::Center)
modalAlignment() 方法也可以接受函数来动态计算它的值。你可以将各种 utility 作为参数注入到该函数中。
Learn more about utility injection.| Utility | Type | Parameter | Description |
|---|---|---|---|
| Action | Filament\Actions\Action | $action | The current action instance. |
| Arguments | array<string, mixed> | $arguments | The array of arguments passed to the action when it was triggered. |
| Data | array<string, mixed> | $data | The array of data submitted from form fields in the action's modal. It will be empty before the modal form is submitted. |
| Livewire | Livewire\Component | $livewire | The Livewire component instance. |
| Eloquent model FQN | ?string<Illuminate\Database\Eloquent\Model> | $model | The Eloquent model FQN for the current action, if one is attached. |
| Mounted actions | array<Filament\Actions\Action> | $mountedActions | The array of actions that are currently mounted in the Livewire component. This is useful for accessing data from parent actions. |
| Eloquent record | ?Illuminate\Database\Eloquent\Model | $record | The Eloquent record for the current action, if one is attached. |
| Schema | Filament\Schemas\Schema | $schema | [Actions in schemas only] The schema object that this action belongs to. |
| Schema component | Filament\Schemas\Components\Component | $schemaComponent | [Actions in schemas only] The schema component that this action belongs to. |
| Schema component state | mixed | $schemaComponentState | [Actions in schemas only] The current value of the schema component. |
| Schema get function | Filament\Schemas\Components\Utilities\Get | $schemaGet | [Actions in schemas only] A function for retrieving values from the schema data. Validation is not run on form fields. |
| Schema operation | string | $schemaOperation | [Actions in schemas only] The current operation being performed by the schema. Usually <code>create</code>, <code>edit</code>, or <code>view</code>. |
| Schema set function | Filament\Schemas\Components\Utilities\Set | $schemaSet | [Actions in schemas only] A function for setting values in the schema data. |
| Selected Eloquent records | Illuminate\Support\Collection | $selectedRecords | [Bulk actions only] The Eloquent records selected in the table. |
| Table | Filament\Tables\Table | $table | [Actions in tables only] The table object that this action belongs to. |

让模态窗标题呈粘性
当模态窗标题超出模态窗时,标题会随内容一起滚动出视图。但是,Slide-Over 窗口的标题呈粘性状态,始终可见。你可以使用 stickyModalHeader() 启用此行为:
use Filament\Actions\Action;
Action::make('updateAuthor')
->schema([
// ...
])
->action(function (array $data): void {
// ...
})
->stickyModalHeader()






