Filament•9mo ago

Wizard "nextAction" save

Hello everyone. Is there a way to save the state of the current step when press "next" button from wizard?

34 Replies

LeandroFerreira•9mo ago

Probably using ->afterValidation() method

DianaMujoiuOP•9mo ago

is not working. Any idea?

LeandroFerreira•9mo ago

what code are you trying?

DianaMujoiuOP•9mo ago

In my custom Livewire component, which incorporates a wizard form, it seems the ->afterValidation method is not available for the wizard

LeandroFerreira•9mo ago

step, actually

DianaMujoiuOP•9mo ago

I've also tried this

                Wizard\Step::make('Preview')
                    ->schema(fn($get) => self::getContentPreviewDescription($get)),

            ])
                ->nextAction(function () {
                    dump($this->form->getState());
                })

                Wizard\Step::make('Preview')
                    ->schema(fn($get) => self::getContentPreviewDescription($get)),

            ])
                ->nextAction(function () {
                    dump($this->form->getState());
                })

but I don't know how can I access the state of the form?

LeandroFerreira•9mo ago

Step::make('Step1')
    ->schema([
    ...
    ])
    ->afterValidation(function (Component $livewire) {
        $data = $livewire->form->getState();
    })

Step::make('Step1')
    ->schema([
    ...
    ])
    ->afterValidation(function (Component $livewire) {
        $data = $livewire->form->getState();
    })

DianaMujoiuOP•9mo ago

Should I add some validation rules in my custom component?

LeandroFerreira•9mo ago

not required

DianaMujoiuOP•9mo ago

Step::make('Step1')
                    ->icon('heroicon-o-map-pin')
                    ->afterValidation(function (Component $livewire) {
                        $data = $livewire->form->getState();
                        dump($data);
                    })

Step::make('Step1')
                    ->icon('heroicon-o-map-pin')
                    ->afterValidation(function (Component $livewire) {
                        $data = $livewire->form->getState();
                        dump($data);
                    })

I have like this but when I press next it goes to the next step instead of show the dump

LeandroFerreira•9mo ago

hum, it is a custom livewire component, right? What about your mount method?

DianaMujoiuOP•9mo ago

Yes, it's a custom livewire component and this is the mount method

    
    public function mount()
    {
        $user = Auth::user();

        $this->consumptionData = $user->consumptionData()->with('extendedWorkPoints')->firstOrNew();

        $this->extendedWorkPoints = optional($this->consumptionData->extendedWorkPoints)->toArray() ?? [];

        $this->form->fill([
            'energy_payment_method' => $this->consumptionData->energy_payment_method,
            'operating_hours_per_day' => $this->consumptionData->operating_hours_per_day,
            'working_days' => $this->consumptionData->working_days,
            'payment_method' => $this->consumptionData->payment_method,
            'acquisition_method' => $this->consumptionData->acquisition_method,
            'storage' => $this->consumptionData->storage,
            'current_supplier' => $this->consumptionData->current_supplier,
            'other_supplier' => $this->consumptionData->other_supplier,
            'part_of_group_or_association' => $this->consumptionData->part_of_group_or_association,
            'replace_current_supplier' => $this->consumptionData->replace_current_supplier,
            'options' => $this->consumptionData->options,
            'access_european_fonds' => $this->consumptionData->access_european_fonds,
            'extendedWorkPoints' => $this->extendedWorkPoints,
        ]);
    }

    
    public function mount()
    {
        $user = Auth::user();

        $this->consumptionData = $user->consumptionData()->with('extendedWorkPoints')->firstOrNew();

        $this->extendedWorkPoints = optional($this->consumptionData->extendedWorkPoints)->toArray() ?? [];

        $this->form->fill([
            'energy_payment_method' => $this->consumptionData->energy_payment_method,
            'operating_hours_per_day' => $this->consumptionData->operating_hours_per_day,
            'working_days' => $this->consumptionData->working_days,
            'payment_method' => $this->consumptionData->payment_method,
            'acquisition_method' => $this->consumptionData->acquisition_method,
            'storage' => $this->consumptionData->storage,
            'current_supplier' => $this->consumptionData->current_supplier,
            'other_supplier' => $this->consumptionData->other_supplier,
            'part_of_group_or_association' => $this->consumptionData->part_of_group_or_association,
            'replace_current_supplier' => $this->consumptionData->replace_current_supplier,
            'options' => $this->consumptionData->options,
            'access_european_fonds' => $this->consumptionData->access_european_fonds,
            'extendedWorkPoints' => $this->extendedWorkPoints,
        ]);
    }

LeandroFerreira•9mo ago

did you add the form statePath?

DianaMujoiuOP•9mo ago

no, should I do this? if yes, how can I do it? I'm not sure if I know what is the form statePath ->statePath('data') oh, this one is . I didn't add it. I have only the model

LeandroFerreira•9mo ago

https://filamentphp.com/docs/3.x/forms/adding-a-form-to-a-livewire-component#adding-the-form

Adding a form to a Livewire component - Form Builder - Filament

LeandroFerreira•9mo ago

statePath will store the form data in the $data. However, you can declare all fields in the class public $energy_payment_method = '';

DianaMujoiuOP•9mo ago

I've declared the data in class public

LeandroFerreira•9mo ago

Did you do this?

public ?array $data = [];

$form
...
->statePath('data');

public ?array $data = [];

$form
...
->statePath('data');

DianaMujoiuOP•9mo ago

yes, I also have this now

LeandroFerreira•9mo ago

ok, Is the dump displayed when you press the next button?

DianaMujoiuOP•9mo ago

nope

LeandroFerreira•9mo ago

console errors?

DianaMujoiuOP•9mo ago

only this one but I think is not related with my stepper

LeandroFerreira•9mo ago

are you using the panel builder or only the form builder?

DianaMujoiuOP•9mo ago

I am using the form builder only

LeandroFerreira•9mo ago

this was supposed to work..

DianaMujoiuOP•9mo ago

yeah, I know... but what do you think about this

 ->nextAction(
        fn (Action $action) => $action->label('Next step'),
    )

 ->nextAction(
        fn (Action $action) => $action->label('Next step'),
    )

? Can implement the saving here, maybe ?

LeandroFerreira•9mo ago

https://github.com/leandrocfe/wizard-example It is working here

GitHub

GitHub - leandrocfe/wizard-example

Contribute to leandrocfe/wizard-example development by creating an account on GitHub.

LeandroFerreira•9mo ago

public function form(Form $form): Form
{
    return $form
        ->schema([
            Wizard::make([
                Step::make('Step1')
                    ->schema([
                        TextInput::make('field1'),
                    ])
                    ->afterValidation(function () {
                        $data = $this->form->getState();
                        dd($data);
                    }),
                Step::make('Step2')
                    ->schema([
                        TextInput::make('field2'),
                    ]),
            ]),
        ])
        ->statePath('data');
}

public function form(Form $form): Form
{
    return $form
        ->schema([
            Wizard::make([
                Step::make('Step1')
                    ->schema([
                        TextInput::make('field1'),
                    ])
                    ->afterValidation(function () {
                        $data = $this->form->getState();
                        dd($data);
                    }),
                Step::make('Step2')
                    ->schema([
                        TextInput::make('field2'),
                    ]),
            ]),
        ])
        ->statePath('data');
}

LeandroFerreira•9mo ago

DianaMujoiuOP•9mo ago

this model is working. the only problem for me is the first step which represents a repeater relationship Thank you so much! Actually the problem was 'skippable'

LeandroFerreira•9mo ago

You didn't mention it, even when you shared some code that you were trying 🤷‍♂️

DianaMujoiuOP•9mo ago

Yeah, I have a huge wizard code and I forgot I have "skippable" , but thank you so much again

Majid Al Zariey•7mo ago

For anyone needing to save the wizard/form while using skippable option listen to next-wizard-step event in the create and Edit Page, for example:

    #[On('next-wizard-step')]
    public function onNext(){
        $this->save(false,false);
    }

    #[On('next-wizard-step')]
    public function onNext(){
        $this->save(false,false);
    }

Gaming

Programming

Wizard "nextAction" save