Filament•4w ago

Close modal from a "extraModalFooterActions"

I have a table with a Filament\Tables\Actions\Action action that opens a modal. This modal also has a extraModalFooterActions action which works as expected. I want the modal to close when the extraModalFooterActions action is completed, how can I go about this? I can't seem to find a way to give the modal a custom ID or retrieve the modals ID to be able to dispatch a close event. This is my current code:

Tables\Actions\Action::make('edit-followup')->label(__('messages.table.action.followup.edit-followup'))
                    ->icon('heroicon-o-pencil-square')
                    ->before(function (Tables\Actions\Action $action, \App\Models\FollowUp $record) {
                        // Authorize the action
                        Gate::forUser(auth()->user())->authorize('update', $record);
                    })
                    ->modalContent(function(\App\Models\FollowUp $record) {
                        return view(
                            'followups.input',
                            [
                                'input' => $record->input,
                            ],
                        );
                    })
                    ->modalSubmitAction(false)
                    ->extraModalFooterActions(function ($action) {
                        return [
                            Tables\Actions\Action::make('save-form')->label(__('messages.table.action.followup.save-form'))
                                ->action(function(\App\Models\FollowUp $record) {
                                    $this->dispatch('vueform.submit.' . $record->input->id);
                                    // Close the modal here?
                                })
                                ->after(function() {
                                    // Close the modal here?
                                })
                        ];
                    }),

Tables\Actions\Action::make('edit-followup')->label(__('messages.table.action.followup.edit-followup'))
                    ->icon('heroicon-o-pencil-square')
                    ->before(function (Tables\Actions\Action $action, \App\Models\FollowUp $record) {
                        // Authorize the action
                        Gate::forUser(auth()->user())->authorize('update', $record);
                    })
                    ->modalContent(function(\App\Models\FollowUp $record) {
                        return view(
                            'followups.input',
                            [
                                'input' => $record->input,
                            ],
                        );
                    })
                    ->modalSubmitAction(false)
                    ->extraModalFooterActions(function ($action) {
                        return [
                            Tables\Actions\Action::make('save-form')->label(__('messages.table.action.followup.save-form'))
                                ->action(function(\App\Models\FollowUp $record) {
                                    $this->dispatch('vueform.submit.' . $record->input->id);
                                    // Close the modal here?
                                })
                                ->after(function() {
                                    // Close the modal here?
                                })
                        ];
                    }),

Solution:

I think you just need to use makeModalSubmitAction() here. have you read this: https://filamentphp.com/docs/3.x/actions/modals#adding-an-extra-modal-action-button-to-the-footer...

Modals - Actions - Filament

Jump to solution

5 Replies

Solution

nowak•4w ago

I think you just need to use makeModalSubmitAction() here. have you read this: https://filamentphp.com/docs/3.x/actions/modals#adding-an-extra-modal-action-button-to-the-footer

Modals - Actions - Filament

nowak•4w ago

Or even just modify the existing modalSubmitAction instead of setting it to false: https://filamentphp.com/docs/3.x/actions/modals#modifying-a-default-modal-footer-action-button

Modals - Actions - Filament

ChesterS•4w ago

cancelParentActions() might be what you're looking for https://filamentphp.com/docs/3.x/actions/modals#opening-another-modal-from-an-extra-footer-action

Modals - Actions - Filament

JensOP•4w ago

Thanks! This worked 👍

nowak•4w ago

No worries. You can mark my answer as the solution by clicking More -> Apps -> Mark Solution, so that it shows up for others with the same issue.

Gaming

Programming

Close modal from a "extraModalFooterActions"