Reactive field inside a dynamic generated schema Filament v3

I have a schema that is generated dynamicly like so based on a selected field

Section::make('AQL Report Form')
    ->schema([
        TextInput::make('limitCardNumber')
            ->label('Limit Card')
            ->disabled(true),
        TextInput::make('orderQuantity')
            ->label('Order Quantity')
            ->disabled(true),
        Select::make('stageId')
            ->options($this->stages)
            ->label('Stage')
            ->afterStateUpdated(function (Set $set, Get $get) {
                $this->updateDefects($this->stageId, $set); // <----- this fills the $defectListSchema property
            })
            ->reactive(),
    ])->columns(3),

Section::make('Defect List')
    ->schema(function () {
        return $this->defectListSchema;
    })
    ->hidden(function () {
        return $this->hideDefectList;
    }),

Section::make('AQL Report Form')
    ->schema([
        TextInput::make('limitCardNumber')
            ->label('Limit Card')
            ->disabled(true),
        TextInput::make('orderQuantity')
            ->label('Order Quantity')
            ->disabled(true),
        Select::make('stageId')
            ->options($this->stages)
            ->label('Stage')
            ->afterStateUpdated(function (Set $set, Get $get) {
                $this->updateDefects($this->stageId, $set); // <----- this fills the $defectListSchema property
            })
            ->reactive(),
    ])->columns(3),

Section::make('Defect List')
    ->schema(function () {
        return $this->defectListSchema;
    })
    ->hidden(function () {
        return $this->hideDefectList;
    }),

And the $this->defectListSchema contains many fields like this

Section::make('')->schema([
    TextInput::make('')->label('Defect')
        ->placeholder($defect['name'])
        ->disabled(true)
        ->columnSpan(2),
    TextInput::make('')->label('Inspection Level')
        ->placeholder($inspectionLevel->name)
        ->disabled(true),
    TextInput::make('')->label('Sample Size')
        ->placeholder($aqlLabel->sample)
        ->disabled(true),
    TextInput::make('numberOfDefects')
        ->numeric()
        ->label('Number of defects')
        ->afterStateUpdated(function (Set $set, Get $get) {
            // PTR compare and save data
        })
        ->reactive(),
])->columns(3),

Section::make('')->schema([
    TextInput::make('')->label('Defect')
        ->placeholder($defect['name'])
        ->disabled(true)
        ->columnSpan(2),
    TextInput::make('')->label('Inspection Level')
        ->placeholder($inspectionLevel->name)
        ->disabled(true),
    TextInput::make('')->label('Sample Size')
        ->placeholder($aqlLabel->sample)
        ->disabled(true),
    TextInput::make('numberOfDefects')
        ->numeric()
        ->label('Number of defects')
        ->afterStateUpdated(function (Set $set, Get $get) {
            // PTR compare and save data
        })
        ->reactive(),
])->columns(3),

But when i type anything in the numberOfDefects field that is reactive the entire form goes blank, disappears. What could be the problem ?

16 Replies

cheesegrits•14mo ago

That doesn't smell right. Seems like you are running reactive code out of a field on a schema in a property that get blown away during the update?

icoOP•14mo ago

something like that yes but that is the problem that the fields are dynamicly generated after a Select is selected

cheesegrits•14mo ago

Can't quite put my finger on it, but looks wrong. You are creating the dynamic schema in $this->defectListSchema, and code within that fires on reactive, but then that property with the code in it gets recreated underneath it.

icoOP•14mo ago

yes that is the problem

cheesegrits•14mo ago

Which I suspect confuses the hell out of the execution stack.

icoOP•14mo ago

the other option that i tough of was to generate all of the fields and hide the ones that are not associated with the selected Select but that will result in a massive schema

cheesegrits•14mo ago

I just don't think it will work the way you are trying to do it.

icoOP•14mo ago

So how should you suggest i generate a schema based on the selected Select option ? And make a field inside of that generated schema be reactive so i can run a couple of checks and coloring it before it is saved in the DB ? i did find in the docs that you could do a Custom Fields but don't know if that will work

cheesegrits•14mo ago

Just apply visible() to the fields / sections / groups, with a closure that $get's the value of the select.

icoOP•14mo ago

but wont that result in a massive schema ?

cheesegrits•14mo ago

No idea, as I don't know what you are trying to render.

icoOP•14mo ago

I have a list of defects where 1 defect may be in more than 1 stage the stages are 4 in total the defects are 33 in total Some defects may or may not be applied on a current stage but most of them are So to make it like this i will have to write down in the schema almost 100 fields/sections and each to be hidden() based on the selected stage That will work but i don't think is the best course of action so thats why i decided to make it dynamicly generated based on the selected stage ( Select )

cheesegrits•14mo ago

What does your data structure look like? Is this 33 separate fields on your table?

icoOP•14mo ago

yes i have 33 defects in the defects table and 4 stages in the stages table i have a junction table between them where most of the defects are applied on all of the stages

cheesegrits•14mo ago

You might be able to generate the schema dynamically, I think the problem is that you are recreating the class property that your code is in, while the code is running.

icoOP•14mo ago

i am generating it dynamically at the moment the problem is that the numberOfDefects field ( that is part of the dynamic schema ) I want it to be able to make checks after the user has typed in something and color it before saving it in the DB Witch means i need the afterStateUpdated method. But that method is only triggered when i have the reactive() method Or if there is another way to trigger the afterStateUpdated() method on the numberOfDefects field without the reactive() method ... that will also work but i don't know of such

Gaming

Programming

Reactive field inside a dynamic generated schema Filament v3