F
Filament•12mo ago
ericmp #2

How to place form actions on header actions

this is what i've tried, the problem is that when i click save in the header action save btn, it doesnt do anything 
<?php

namespace App\Filament\Resources\FormResource\Pages;

use App\Filament\Resources\FormResource;
use Filament\Actions;
use Filament\Resources\Pages\CreateRecord;
use Filament\Support\Colors\Color;

class CreateForm extends CreateRecord
{
    protected static string $resource = FormResource::class;

    protected static bool $canCreateAnother = false;

    protected function getHeaderActions(): array
    {
        return [
            Actions\Action::make('cancel')
                ->label(__('filament-panels::resources/pages/create-record.form.actions.cancel.label'))
                ->color('gray')
                ->url(route('filament.admin.resources.forms.index'))
                ->icon('heroicon-o-backspace')
            ,
            $this->getCreateFormAction()->icon('heroicon-m-cloud-arrow-down')->color(Color::Teal),
        ];
    }

    protected function getFormActions(): array
    {
        return [
            $this->getCreateFormAction()->icon('heroicon-m-cloud-arrow-down')->color(Color::Teal), // ⚠️ this should be deleted, as we use it in header actions. but the one in header actions doesnt work, why?
            //
        ];
    }

    protected function getCreateFormAction(): Actions\Action
    {
        return Actions\Action::make('create')
            ->label(__('filament-panels::resources/pages/create-record.form.actions.create.label'))
            ->submit('create')
            ->keyBindings(['mod+s'])
        ;
    }
}
<?php

namespace App\Filament\Resources\FormResource\Pages;

use App\Filament\Resources\FormResource;
use Filament\Actions;
use Filament\Resources\Pages\CreateRecord;
use Filament\Support\Colors\Color;

class CreateForm extends CreateRecord
{
    protected static string $resource = FormResource::class;

    protected static bool $canCreateAnother = false;

    protected function getHeaderActions(): array
    {
        return [
            Actions\Action::make('cancel')
                ->label(__('filament-panels::resources/pages/create-record.form.actions.cancel.label'))
                ->color('gray')
                ->url(route('filament.admin.resources.forms.index'))
                ->icon('heroicon-o-backspace')
            ,
            $this->getCreateFormAction()->icon('heroicon-m-cloud-arrow-down')->color(Color::Teal),
        ];
    }

    protected function getFormActions(): array
    {
        return [
            $this->getCreateFormAction()->icon('heroicon-m-cloud-arrow-down')->color(Color::Teal), // ⚠️ this should be deleted, as we use it in header actions. but the one in header actions doesnt work, why?
            //
        ];
    }

    protected function getCreateFormAction(): Actions\Action
    {
        return Actions\Action::make('create')
            ->label(__('filament-panels::resources/pages/create-record.form.actions.create.label'))
            ->submit('create')
            ->keyBindings(['mod+s'])
        ;
    }
}
27 Replies
bernhard
bernhard•12mo ago
You mean you want a savebutton in the header of create/edit form? Something like this
ericmp #2
ericmp #2OP•12mo ago
exactly
bernhard
bernhard•12mo ago
You only need to run the save action: 
Action::make('save')
    ->action('save')
Action::make('save')
    ->action('save')
ericmp #2
ericmp #2OP•12mo ago
and i already have it, but when i click it, it doesnt do anything
bernhard
bernhard•12mo ago
Full example: 
class EditHost extends EditRecord
{
    protected static string $resource = HostResource::class;

    protected function getHeaderActions(): array
    {
        return [
            Actions\DeleteAction::make(),
            Action::make('save')
                ->action('save')
        ];
    }
}
class EditHost extends EditRecord
{
    protected static string $resource = HostResource::class;

    protected function getHeaderActions(): array
    {
        return [
            Actions\DeleteAction::make(),
            Action::make('save')
                ->action('save')
        ];
    }
}
ericmp #2
ericmp #2OP•12mo ago
i use the ->submit('create') ill try ur example now, lets see
bernhard
bernhard•12mo ago
and thats wrong
ericmp #2
ericmp #2OP•12mo ago
but note that im in the createrecord is not editrecord and that action is okay cuz if i use it inisde the getFormActions fn, works fine
bernhard
bernhard•12mo ago
yeah. The create isn't the problem, but the submit
ericmp #2
ericmp #2OP•12mo ago
but when putting it inisde getHeaderActions doesnt
bernhard
bernhard•12mo ago
class CreateHost extends CreateRecord
{
    protected static string $resource = HostResource::class;


    protected function getHeaderActions(): array
    {
        return [
            Action::make('save')
                ->action('create')
        ];
    }
}
class CreateHost extends CreateRecord
{
    protected static string $resource = HostResource::class;


    protected function getHeaderActions(): array
    {
        return [
            Action::make('save')
                ->action('create')
        ];
    }
}
same goes for create
ericmp #2
ericmp #2OP•12mo ago
also i noticed that when there is an image, the one in the getHeaderActions is not showing the spinner with that text saying that an image is being uploaded, while the one in the getFormActions it does or i miss something or this doesnt work for me or something 🤔 hmmm (and before all this, did run composer update) okay, i miss something then hmm
bernhard
bernhard•12mo ago
copy paste your createRecord class
ericmp #2
ericmp #2OP•12mo ago
bernhard
bernhard•12mo ago
Yeah. But there u are using the wrong method
bernhard
bernhard•12mo ago
No description
bernhard
bernhard•12mo ago
Use action instead of submit
ericmp #2
ericmp #2OP•12mo ago
yeah this was the issue, anyways look the buttons, look different when uploading a file. i guess that is a thing about filament
No description
ericmp #2
ericmp #2OP•12mo ago
thanks for ur time again bro
bernhard
bernhard•12mo ago
Well, for this I have no solution atm. Filament is changing the state of the button automatically. No clue how to reproduce it on your header button
ericmp #2
ericmp #2OP•12mo ago
its fine (: but how could i like ask to fix/make this feature so the header actions also await for a file upload to finish? u'd do it in the issues github? -> https://github.com/filamentphp/filament/issues
bernhard
bernhard•12mo ago
This will probably not get "fixed" since its not an issue.
ericmp #2
ericmp #2OP•12mo ago
yeah well yeah, i said fix/feature (: but idk 🤷 id love to know how to fix it myself haha
bernhard
bernhard•12mo ago
well, i tried it now just with sleep and then there is a loading animation at least
ericmp #2
ericmp #2OP•12mo ago
hmm wdym just with sleep, using sleep($seconds) somewhere in the code?
bernhard
bernhard•12mo ago
So this 
Action::make('save')
                ->action(function (Action $action) {
                    sleep(1);
                    $this->create();
                })
Action::make('save')
                ->action(function (Action $action) {
                    sleep(1);
                    $this->create();
                })
thats not a solution of course, but as you can see, the button is showing the loading circles
ericmp #2
ericmp #2OP•12mo ago
u r right, but still doesnt show the "uploading file txt", but its fine i guess for now it is what it is, not a big problem just wondering if the user is like, quick and just drops the file and presses submit, havent tested it. i note it to do it tomorrow
Want results from more Discord servers?
Add your server