Filament•8mo ago

In Form Builder, how to listen for input from forms?

Package Form builder Package Version 3.0 How can we help you? In Form Builder, how to listen for input from forms? I want to trigger a method when listening to text-input or Select content change, what should I do? For example, in the following code, I want to trigger methods or events when the content of the TextInput and Select in the Builder changes, what should I do?

class Add extends Component  implements HasForms, HasActions
{
    use InteractsWithActions;
    use InteractsWithForms;

    public OrderModel $order;
    public $productsData;

    public function render()
    {
        return view('livewire.company.order.add');
    }

    public function addOrderAction(): Action
    {
        return Action::make('addOrder')
            ->form([
                Textarea::make('notes')
                    ->rows(3),
                Builder::make('paybacks')
                    ->blocks([
                        Builder\Block::make('heading')
                            ->schema([
                                TextInput::make('amount')->numeric()->required(),
                                Select::make('status')
                                    ->options([
                                        'pending' => 'pending',
                                        'completed' => 'completed',
                                    ])->native(false)->required(),
                            ])->columns(3),
                        // ...
                    ]),
                FileUpload::make('contract')->multiple(),
            ])
            ->action(function (array $data, OrderModel $record): void {

            })
            ->mutateFormDataUsing(function (array $data): array {

            });
    }
}

class Add extends Component  implements HasForms, HasActions
{
    use InteractsWithActions;
    use InteractsWithForms;

    public OrderModel $order;
    public $productsData;

    public function render()
    {
        return view('livewire.company.order.add');
    }

    public function addOrderAction(): Action
    {
        return Action::make('addOrder')
            ->form([
                Textarea::make('notes')
                    ->rows(3),
                Builder::make('paybacks')
                    ->blocks([
                        Builder\Block::make('heading')
                            ->schema([
                                TextInput::make('amount')->numeric()->required(),
                                Select::make('status')
                                    ->options([
                                        'pending' => 'pending',
                                        'completed' => 'completed',
                                    ])->native(false)->required(),
                            ])->columns(3),
                        // ...
                    ]),
                FileUpload::make('contract')->multiple(),
            ])
            ->action(function (array $data, OrderModel $record): void {

            })
            ->mutateFormDataUsing(function (array $data): array {

            });
    }
}

1 Reply

hrank8t•8mo ago

https://filamentphp.com/docs/3.x/forms/advanced#the-basics-of-reactivity afterStateUpdated live reactive hydrated etc. Go through documentation. It's given in pretty detail. https://filamentphp.com/docs/3.x/forms/advanced#field-updates

Advanced forms - Form Builder - Filament

Gaming

Programming

In Form Builder, how to listen for input from forms?