Save Wizard on clicking next button with alpineClickHandler

I have a question with limited resources online. I want to auto-save responses after a step in a Wizard. From Dan's comment under this video, I learned that AlpineJS can trigger an existing action or javascript.

1. How can I log something to the console or show an alert on clicking "Next"?
2. How can I auto-save responses while using AlpineJS to trigger actions?

Here's an example snippet:

Wizard::make([  
    Wizard\Step::make(__('Step1'))  
        ->schema([  
            // ...  
        ])->afterValidation(function () {  
            Notification::make()  
                ->title('Saved successfully')  
                ->success()  
                ->send();  
            Action::make('next')  
                ->alpineClickHandler('console.log("next")');  
            }  
        )

Wizard::make([  
    Wizard\Step::make(__('Step1'))  
        ->schema([  
            // ...  
        ])->afterValidation(function () {  
            Notification::make()  
                ->title('Saved successfully')  
                ->success()  
                ->send();  
            Action::make('next')  
                ->alpineClickHandler('console.log("next")');  
            }  
        )

This doesn't work. afterValidation works, but Action::make('next')->alpineClickHandler doesn't

Thank you!

YouTubeFilament Daily

Filament Wizard: Summary Step with Edit Button

If you want to users to double-check the information before submitting, here's how to do it in a Wizard.

Full source code: https://filamentexamples.com/project/wizard-with-summary-overview-and-back-buttons

More Filament examples on our website: https://filamentexamples.com

Save Wizard on clicking next button with alpineClickHandler

Wizard::make([  
    Wizard\Step::make(__('Step1'))  
        ->schema([  
            // ...  
        ])->afterValidation(function () {  
            Notification::make()  
                ->title('Saved successfully')  
                ->success()  
                ->send();  
            Action::make('next')  
                ->alpineClickHandler('console.log("next")');  
            }  
        )

Wizard::make([  
    Wizard\Step::make(__('Step1'))  
        ->schema([  
            // ...  
        ])->afterValidation(function () {  
            Notification::make()  
                ->title('Saved successfully')  
                ->success()  
                ->send();  
            Action::make('next')  
                ->alpineClickHandler('console.log("next")');  
            }  
        )

This doesn't work. afterValidation works, but Action::make('next')->alpineClickHandler doesn't

Thank you!

YouTubeFilament Daily

Filament Wizard: Summary Step with Edit Button

Save Wizard on clicking next button with alpineClickHandler

Save Wizard on clicking next button with alpineClickHandler

Similar Threads

Similar Threads

Similar Threads