Languages

Version

Theme

Action

模态框

简介

Action 可能会在运行前要求额外确认或者用户输入。你可以在 Action 执行之前打开模态框实现该功能。

确认模态框

使用 requiresConfirmation() 方法,你可以在 Action 运行之前请求确认。这对于破坏性操作,比如删除记录,特别有用。

use App\Models\Post;
use Filament\Actions\Action;

Action::make('delete')
    ->action(fn (Post $record) => $record->delete())
    ->requiresConfirmation()
Confirmation modal

NOTE

如果使用 url() 代替 action(),那确认模态框将会不可用。相反,你应该在 action() 方法内,重定向 URL。

控制模态框内容

自定义模态框标题、描述及提交按钮标签

你可以自定义模态框的标题、描述及提交按钮标签:

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')
Confirmation modal with custom text

在模态框中渲染 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 create, edit, or view.
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();
    })
Modal with form
使用现有数据填充表单

通过 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 create, edit, or view.
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),
            ]),
    ])
Modal with wizard

在模态框内添加图标

使用 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 create, edit, or view.
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.
Confirmation modal with icon

默认情况下,图标继承了 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 create, edit, or view.
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.

自定义模态框内容对齐方式

默认情况下,模态框内容对齐到起始位置,或者如果模态框宽度xssm,则居中对齐。如果你想修改模态框内容的对齐方式,可以在 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 create, edit, or view.
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()

默认情况下,模态框的 footer 在内容之后内联渲染。但是,Slide-Over 窗口的 footer 呈粘性状态,即使滚动内容也始终可见。你可以使用 stickyModalFooter() 启用此行为:

use Filament\Actions\Action;

Action::make('updateAuthor')
    ->schema([
        // ...
    ])
    ->action(function (array $data): void {
        // ...
    })
    ->stickyModalFooter()

自定义模态框内容

你可以定义要在模态框内渲染的自定义内容,为此,可以通过将 Blade 视图传递到 modalContent() 方法来指定:

use App\Models\Post;
use Filament\Actions\Action;

Action::make('advance')
    ->action(fn (Post $record) => $record->advance())
    ->modalContent(view('filament.pages.actions.advance'))
modalContent() 方法也可以接受函数来动态计算它的值。你可以将各种 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 create, edit, or view.
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 的 $record,你可以将其传入到视图中:

use Filament\Actions\Action;
use Illuminate\Contracts\View\View;

Action::make('advance')
    ->action(fn (Contract $record) => $record->advance())
    ->modalContent(fn (Contract $record): View => view(
        'filament.pages.actions.advance',
        ['record' => $record],
    ))

在表单下方添加自定义模态框内容

默认情况下,如果有自定义内容的话,它们会展示在模态框表单上方,不过你可以使用 modalContentFooter() 将内容添加到表单下方:

use App\Models\Post;
use Filament\Actions\Action;

Action::make('advance')
    ->action(fn (Post $record) => $record->advance())
    ->modalContentFooter(view('filament.pages.actions.advance'))
modalContentFooter() 方法也可以接受函数来动态计算它的值。你可以将各种 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 create, edit, or view.
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 按钮到自定义模态框内容中,如果你想添加按钮执行一个 Action(非主 Action),这就有用。你可以使用 registerModalActions() 方法注册 Action,并将其传入到视图中:

use App\Models\Post;
use Filament\Actions\Action;
use Illuminate\Contracts\View\View;

Action::make('advance')
    ->registerModalActions([
        Action::make('report')
            ->requiresConfirmation()
            ->action(fn (Post $record) => $record->report()),
    ])
    ->action(fn (Post $record) => $record->advance())
    ->modalContent(fn (Action $action): View => view(
        'filament.pages.actions.advance',
        ['action' => $action],
    ))

现在,在视图文件中,你可以调用 getModalAction() 来渲染 Action 按钮:

<div>
    {{ $action->getModalAction('report') }}
</div>

使用 SlideOver 替代模态框

使用 slideOver() 方法,你可以打开滑块(SlideOver)对话框,而非模态框:

use Filament\Actions\Action;

Action::make('updateAuthor')
    ->schema([
        // ...
    ])
    ->action(function (array $data): void {
        // ...
    })
    ->slideOver()
Slide over with form

不再是在屏幕的中间打开,模态框内容现在会从右边滑入(slide in)并占用浏览器的全部高度。

修改模态框宽度

使用 modalWidth() 方法,你可以修改模态框宽度。宽度选项对应于 Tailwind 的 max-width 大小。可用选项包括 ExtraSmallSmallMediumLargeExtraLargeTwoExtraLargeThreeExtraLargeFourExtraLargeFiveExtraLargeSixExtraLargeSevenExtraLargeScreen

use Filament\Actions\Action;
use Filament\Support\Enums\Width;

Action::make('updateAuthor')
    ->schema([
        // ...
    ])
    ->action(function (array $data): void {
        // ...
    })
    ->modalWidth(Width::FiveExtraLarge)
modalWidth() 方法也可以接受函数来动态计算它的值。你可以将各种 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 create, edit, or view.
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.

当模态框打开时执行代码

使用 mountUsing() 方法,你可以在模态框打开时,在闭包中执行代码。

use Filament\Actions\Action;
use Filament\Schemas\Schema;

Action::make('create')
    ->mountUsing(function (Schema $form) {
        $form->fill();

        // ...
    })

默认情况下,Filament 使用 mountUsing() 方法去初始化表单。如果重写该方法,你需要调用 $form->fill() 以确保表单正确初始化。如果你想要使用数据填充表单,你可以传入数组到 fill() 方法中,而不是在 Action 中使用 fillForm() 方法

默认情况下,模态框的 Footer 中有两个操作。第一个是提交按钮,用于执行 action()。第二个按钮用于关闭模态框并取消操作。

要修改默认操作按钮的 Action 实例,你可以将闭包传递给 modalSubmitAction()modalCancelAction() 方法:

use Filament\Actions\Action;

Action::make('help')
    ->modalContent(view('actions.help'))
    ->modalCancelAction(fn (Action $action) => $action->label('Close'))

可用于自定义触发按钮的方法同时也用于修改闭包内的 $action 实例。

TIP

要在模态框中自定义按钮标签,可以使用 modalSubmitActionLabel()modalCancelActionLabel() 方法。如果无需进一步自定义,你无需传入函数到 modalSubmitAction()modalCancelAction() 方法中。

要移除默认操作,你可以传递 falsemodalSubmitAction() 或者 modalCancelAction() 中:

use Filament\Actions\Action;

Action::make('help')
    ->modalContent(view('actions.help'))
    ->modalSubmitAction(false)

使用 extraModalFooterActions() 方法,你可以传入其他的 Action 作为数组,使之在默认数组之间,在模态框的 Footer 中进行渲染。

use Filament\Actions\Action;

Action::make('create')
    ->schema([
        // ...
    ])
    // ...
    ->extraModalFooterActions(fn (Action $action): array => [
        $action->makeModalSubmitAction('createAnother', arguments: ['another' => true]),
    ])
extraModalFooterActions() 方法也可以接受函数来动态计算它的值。你可以将各种 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 create, edit, or view.
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->makeModalSubmitAction() 返回一个操作实例,可以使用可用于自定义触发按钮的方法进行自定义。

makeModalSubmitAction() 的第二个参数允许传递一个参数数组,这些参数可以在操作的 action() 闭包中以 $arguments 的形式访问。这些参数可以用作标志,指示操作应根据用户的决策采取不同的行为:

use Filament\Actions\Action;

Action::make('create')
    ->schema([
        // ...
    ])
    // ...
    ->extraModalFooterActions(fn (Action $action): array => [
        $action->makeModalSubmitAction('createAnother', arguments: ['another' => true]),
    ])
    ->action(function (array $data, array $arguments): void {
        // Create

        if ($arguments['another'] ?? false) {
            // Reset the form and don't close the modal
        }
    })

你可以在操作中嵌入其他操作,这允许你在额外的 Footer 操作中打开新的模态框:

use Filament\Actions\Action;

Action::make('edit')
    // ...
    ->extraModalFooterActions([
        Action::make('delete')
            ->requiresConfirmation()
            ->action(function () {
                // ...
            }),
    ])

现在,edit 模态框在 Footer 中有一个 Delete 按钮,点击该按钮将会打开一个确认模态框。该操作完全独立于 edit 操作,点击时不会运行 edit 操作。

此例中,你可能希望运行 delete 操作时取消 edit 操作。你可以使用 cancelParentActions() 方法实现:

use Filament\Actions\Action;

Action::make('delete')
    ->requiresConfirmation()
    ->action(function () {
        // ...
    })
    ->cancelParentActions()

如果你有多个父级操作深度嵌套,但不希望取消所有父级操作,你可以传入要取消的父级操作名称(包括其子操作)到 cancelParentActions()

use Filament\Actions\Action;

Action::make('first')
    ->requiresConfirmation()
    ->action(function () {
        // ...
    })
    ->extraModalFooterActions([
        Action::make('second')
            ->requiresConfirmation()
            ->action(function () {
                // ...
            })
            ->extraModalFooterActions([
                Action::make('third')
                    ->requiresConfirmation()
                    ->action(function () {
                        // ...
                    })
                    ->extraModalFooterActions([
                        Action::make('fourth')
                            ->requiresConfirmation()
                            ->action(function () {
                                // ...
                            })
                            ->cancelParentActions('second'),
                    ]),
            ]),
    ])

本例中,如果运行了 forth 操作,那么 second 操作将被取消,同时 third 操作也会取消,因为它是 second 的子操作。first 操作没有被取消,因为它是 second 的父级操作。first 操作的模态框会保持打开状态。

在子操作中访问父操作的信息

通过将 $mountedActions 数组注入到你嵌入 Action 的函数中,你可以访问父级 Action 以及其原始数据和参数。比如,要获取页面中当前激活的顶级父 Action,你可以使用 $mountedActions[0]。在此基础上,你可以调用 $mountedActions[0]->getRawData() 获取该 Action 的原始数据。请注意,该原始数据还未经验证,因为此 Action 还没有提交:

use Filament\Actions\Action;
use Filament\Forms\Components\TextInput;

Action::make('first')
    ->schema([
        TextInput::make('foo'),
    ])
    ->action(function () {
        // ...
    })
    ->extraModalFooterActions([
        Action::make('second')
            ->requiresConfirmation()
            ->action(function (array $mountedActions) {
                dd($mountedActions[0]->getRawData());
            
                // ...
            }),
    ])

你可以使用 $mountedActions[0]->getArguments() 方法对父操作的当前参数执行类似的操作。

即使有多层嵌套,$mountedActions 数组也会包含当前处于活动状态的每个操作,因此你可以访问有关它们的信息:

use Filament\Actions\Action;

Action::make('first')
    ->schema([
        TextInput::make('foo'),
    ])
    ->action(function () {
        // ...
    })
    ->extraModalFooterActions([
        Action::make('second')
            ->schema([
                TextInput::make('bar'),
            ])
            ->arguments(['number' => 2])
            ->action(function () {
                // ...
            })
            ->extraModalFooterActions([
                Action::make('third')
                    ->schema([
                        TextInput::make('baz'),
                    ])
                    ->arguments(['number' => 3])
                    ->action(function () {
                        // ...
                    })
                    ->extraModalFooterActions([
                        Action::make('fourth')
                            ->requiresConfirmation()
                            ->action(function (array $mountedActions) {
                                dd(
                                    $mountedActions[0]->getRawData(),
                                    $mountedActions[0]->getArguments(),
                                    $mountedActions[1]->getRawData(),
                                    $mountedActions[1]->getArguments(),
                                    $mountedActions[2]->getRawData(),
                                    $mountedActions[2]->getArguments(),
                                );
                                // ...
                            }),
                    ]),
            ]),
    ])

关闭模态框

点击模态框外部关闭模态框

默认情况下,当你点击模态框外部时,它会自动关闭。如果你想针对特定操作禁用此行为,可以使用 closeModalByClickingAway(false) 方法:

use Filament\Actions\Action;

Action::make('updateAuthor')
    ->schema([
        // ...
    ])
    ->action(function (array $data): void {
        // ...
    })
    ->closeModalByClickingAway(false)
closeModalByClickingAway() 方法也可以接受函数来动态计算它的值。你可以将各种 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 create, edit, or view.
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.

如果你想修改应用中的所有模态框的这一行为,你可以在服务提供者或中间件中调用 Modal::closedByClickingAway()

use Filament\Support\View\Components\ModalComponent;

ModalComponent::closedByClickingAway(false);

通过 Escape 键关闭模态框

默认情况下,当你在模态上按下 Escape 键时,模态框会关闭。如果你希望为特定 Action 禁用此行为,可以使用 closeModalByEscaping(false) 方法:

use Filament\Actions\Action;

Action::make('updateAuthor')
    ->schema([
        // ...
    ])
    ->action(function (array $data): void {
        // ...
    })
    ->closeModalByEscaping(false)
closeModalByEscaping() 方法也可以接受函数来动态计算它的值。你可以将各种 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 create, edit, or view.
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.

如果你想修改应用中的所有模态框的这一行为,你可以在服务提供者或中间件中调用 Modal::closedByEscaping()

use Filament\Support\View\Components\ModalComponent;

ModalComponent::closedByEscaping(false);

隐藏模态框关闭按钮

默认情况下,模态框在右上角有一个关闭按钮。如果你想隐藏该关闭按钮,你可以使用 modalCloseButton(fasle) 方法:

use Filament\Actions\Action;

Action::make('updateAuthor')
    ->schema([
        // ...
    ])
    ->action(function (array $data): void {
        // ...
    })
    ->modalCloseButton(false)
modalCloseButton() 方法也可以接受函数来动态计算它的值。你可以将各种 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 create, edit, or view.
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.

如果你想在应用中隐藏所有模态框的关闭按钮,你可以在服务提供者或中间件中调用 Modal::closeButton(false)

use Filament\Support\View\Components\ModalComponent;

ModalComponent::closeButton(false);

阻止模态框自动聚焦

默认情况下,模态框打开时会自动聚焦在第一个可聚焦元素上。如果要禁用此行为,可以使用 modalAutofocus(false) 方法:

use Filament\Actions\Action;

Action::make('updateAuthor')
    ->schema([
        // ...
    ])
    ->action(function (array $data): void {
        // ...
    })
    ->modalAutofocus(false)
modalAutofocus() 方法也可以接受函数来动态计算它的值。你可以将各种 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 create, edit, or view.
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.

如果你想让应用中的所有模态框都禁用自动聚焦,你可以在服务提供者或者中间件中调用 Modal::autofocus(false)

use Filament\Support\View\Components\ModalComponent;

ModalComponent::autofocus(false);

优化模态框配置方法

当你在模态框配置方法(比如 modalHeading())中使用数据库查询或者其他繁重操作时,它们可以执行多次。这是因为 Filament 使用这些方法来决定是否渲染模态框,以及渲染模态框的内容。

要跳过这个确定是否渲染模态框的检查,你可以使用 modal() 方法,该方法会告诉 Filament 该模态框存在于该 Action 中,且不需要再次检查:

use Filament\Actions\Action;

Action::make('updateAuthor')
    ->modal()

条件性隐藏模态框

在退回默认操作时,你可能需要条件性地显示模态以进行确认。这可以通过使用 modalHidden()来实现:

use Filament\Actions\Action;

Action::make('create')
    ->action(function (array $data): void {
        // ...
    })
    ->modalHidden($this->role !== 'admin')
    ->modalContent(view('filament.pages.actions.create'))
modalHidden() 方法也可以接受函数来动态计算它的值。你可以将各种 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 create, edit, or view.
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.

向模态框窗口添加额外属性

使用 extraModalWindowAttributes(),你也可以将额外的 HTML 属性传递给模态框窗口,这些属性将合并到外层 HTML 元素中。这些属性应该使用数组表示,键为属性名,值为属性值:

use Filament\Actions\Action;

Action::make('updateAuthor')
    ->extraModalWindowAttributes(['class' => 'update-author-modal'])
除了允许静态值之外,extraModalWindowAttributes() 方法也可以接受函数来动态计算它的值。你可以将各种 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 create, edit, or view.
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.

TIP

默认情况下,多次调用 extraModalWindowAttributes() 将会重写之前的属性。如果你想要合并属性,可以传递 merge: true 给该方法。

Edit on GitHub

Still need help? Join our Discord community or open a GitHub discussion

Previous
概述