FilamentF
Filament6mo ago
Felix

Submit a form with a header Action on a custom page

Is it possible to use a headerAction to submit a form on a custom page?
I want to move the submit action to the top right of the page in the header.
but I don't know what the trick is to then submit the form with the button.

I have tried JS to submit the form but,
I assume that a JS submit doesn't work with wire:submit.

I have the following parts in my code:

in the Class:
protected function getHeaderActions(): array { return [ Action::make('save')->label('Opslaan')->keyBindings(['command+s', 'ctrl+s']), ]; public function form(Form $form): Form { return $form ->schema([...]) ->statePath('data') ->model($this->course); }

in the blade:
<x-filament-panels::page class="space-y-6"> <form wire:submit="save" class="space-y-6"> {{ $this->form }} </form> </x-filament-panels::page>
Solution
Ok try this
protected function getHeaderActions(): array
{
    return [
        Action::make('save')
            ->extraAttributes([
                'wire:click.prevent' => 'save',
            ])
            ->submit('MY-FORM-ID')
    ];
}
Was this page helpful?