how to, livewire form save button to header in filament custom page

Hi, As I summarized in the title, I have a livewire form and I have a submit button in the form. I want to move this submit button to the header (as seen in the picture), how can I do it?
No description
Solution:
For example. Header action:
Action::make('saveForm')
->action(function () {
$this->dispatch('saveFormData');
}),
Action::make('saveForm')
->action(function () {
$this->dispatch('saveFormData');
}),
...
Jump to solution
8 Replies
toeknee
toeknee13mo ago
How have you added the submit button, did you see: I believe the original v2 principle should work: https://filamentphp.com/docs/2.x/forms/getting-started#preparing-your-livewire-component
S. Mert ÖZTÜRK
S. Mert ÖZTÜRKOP13mo ago
@toeknee i don't have any problem with form submit, or button functionality. If you look to screen shot you can see, i want to move button to page header. But it's livewire component and button must be inside of form. But i'm asking, is there anyway to move header
Sauravisus
Sauravisus13mo ago
That'd move it outside the form and make it non-functional. I'm trying to find a solution to the same problem. 😅
mar5hall
mar5hall13mo ago
Try to make a header action with dispatch event for save form. And in component need to add this event listener.
Solution
mar5hall
mar5hall13mo ago
For example. Header action:
Action::make('saveForm')
->action(function () {
$this->dispatch('saveFormData');
}),
Action::make('saveForm')
->action(function () {
$this->dispatch('saveFormData');
}),
Then in component:
#[On('saveFormData')]
public function saveFormData()
{
## Create record or something;
dd($this->form->getState());
}
#[On('saveFormData')]
public function saveFormData()
{
## Create record or something;
dd($this->form->getState());
}
Sauravisus
Sauravisus13mo ago
Alternatively, the one and only Dan Harrin just shared a solution to putting the submit button into header actions over here: https://discord.com/channels/883083792112300104/1166754657310355456/1166766327072051241
S. Mert ÖZTÜRK
S. Mert ÖZTÜRKOP13mo ago
This is acceptable and working good, thanks for help.
Want results from more Discord servers?
Add your server