Filament•4mo ago

How to trigger a click event on 'next' button click in Wizard Step form.

I am using Action on table. Inside the Action I am using Wizard Steps. In my first Step using a Livewire component to create table like form. Now by default I have 'Next' in Step 1 to goto in Step 2. I would like to trigger a click event on click of this button Next button. Any idea please help.

Wizard::make()
     ->steps([
              Step::make('Select Channels')
           ->schema([
                    TextInput::make('search')
                        ->label('Search Channels')
                        ->placeholder('Search channels...')
                        ->reactive()
                        ->afterStateUpdated(function ($state, $get, $set) {
                                $set('search', $state);                   
                        }),
                            
                    Forms\Components\View::make('livewire-channel-table')
                        ->afterStateUpdated(function ($state, $get, $set) {
                            $set('selectedChannels', $state['selectedChannels'] ?? []);
                        })
                        ->extraAttributes(['wire:ignore' => true]), 
                        ]),
                        
            Step::make('Another Step')
            // More code continued...

Wizard::make()
     ->steps([
              Step::make('Select Channels')
           ->schema([
                    TextInput::make('search')
                        ->label('Search Channels')
                        ->placeholder('Search channels...')
                        ->reactive()
                        ->afterStateUpdated(function ($state, $get, $set) {
                                $set('search', $state);                   
                        }),
                            
                    Forms\Components\View::make('livewire-channel-table')
                        ->afterStateUpdated(function ($state, $get, $set) {
                            $set('selectedChannels', $state['selectedChannels'] ?? []);
                        })
                        ->extraAttributes(['wire:ignore' => true]), 
                        ]),
                        
            Step::make('Another Step')
            // More code continued...

4 Replies

Arghyaashu•4mo ago

https://filamentphp.com/docs/3.x/forms/layout/wizard#customizing-the-wizard-action-objects This may help

Wizard - Form Builder - Filament

Sujay BarmaOP•4mo ago

Thank you 🙏 now I am using this

 ->nextAction(
                fn (Forms\Components\Actions\Action $action) => $action->label('Next step'),
            )

 ->nextAction(
                fn (Forms\Components\Actions\Action $action) => $action->label('Next step'),
            )

could you please guide me on how a click event here.

Arghyaashu•4mo ago

Just dispatch any event from nextAction, when the next button is clicked it will work

Sujay BarmaOP•4mo ago

Gaming

Programming

How to trigger a click event on 'next' button click in Wizard Step form.