Autofill TextInput based on Select value in FilamentPhp

I am developing a project in FilamentPhp and I have encountered the following problem that I do not know how to solve.

I would like to be able to auto-complete a TextInput dynamically depending on the value I select in a Select, that is, the logic would be the following:

I select an option from the Select
I make a query with the selected option from the Select to retrieve all the information from the model
I auto-fill the TextInput with the retrieved information.

Can anyone help me with this?

Regards

Solution

This is possible, check the following over the docs:

- Form reactivity - live() method: https://filamentphp.com/docs/3.x/forms/advanced#the-basics-of-reactivity

- Set the state of another field: https://filamentphp.com/docs/3.x/forms/advanced#injecting-a-function-to-set-the-state-of-another-field

- Getting the state of another field:
https://filamentphp.com/docs/3.x/forms/advanced#injecting-a-function-to-set-the-state-of-another-field

So, this would work like:

->schema([
    Forms\Components\TextInput::make('this_field_will_update'),
    Forms\Components\Select::make('this_will_trigger')
        ->live()
        ->afterStateUpdated(function (Set $set, Get $get) {
            $yourlogic = YourModel::findOrFail($get('this_will_trigger'));
            $set('updated_field', $yourlogic->name);
        })
        ->required(),

->schema([
    Forms\Components\TextInput::make('this_field_will_update'),
    Forms\Components\Select::make('this_will_trigger')
        ->live()
        ->afterStateUpdated(function (Set $set, Get $get) {
            $yourlogic = YourModel::findOrFail($get('this_will_trigger'));
            $set('updated_field', $yourlogic->name);
        })
        ->required(),

So when you update the select "this_will_trigger" it will find that id on YourModel and update the textinput "this_field_will_update"

Advanced forms - Form Builder - Filament

Jump to solution

Autofill TextInput based on Select value in FilamentPhp

Solution

->schema([
    Forms\Components\TextInput::make('this_field_will_update'),
    Forms\Components\Select::make('this_will_trigger')
        ->live()
        ->afterStateUpdated(function (Set $set, Get $get) {
            $yourlogic = YourModel::findOrFail($get('this_will_trigger'));
            $set('updated_field', $yourlogic->name);
        })
        ->required(),

->schema([
    Forms\Components\TextInput::make('this_field_will_update'),
    Forms\Components\Select::make('this_will_trigger')
        ->live()
        ->afterStateUpdated(function (Set $set, Get $get) {
            $yourlogic = YourModel::findOrFail($get('this_will_trigger'));
            $set('updated_field', $yourlogic->name);
        })
        ->required(),

So when you update the select "this_will_trigger" it will find that id on YourModel and update the textinput "this_field_will_update"

Advanced forms - Form Builder - Filament

Jump to solution

Autofill TextInput based on Select value in FilamentPhp

Autofill TextInput based on Select value in FilamentPhp

Similar Threads

Similar Threads

Similar Threads