Filament•12mo ago

select input for actions

I am not sure if this is in the documentation as I cant find any reference... I have my list table, and they each have the view, edit and delete action. However, I then want to create a 4th action that is a dropdown populated with language locales. I want the option to open the dropdown and select a language locale then I can do the custom action to open the edit screen but with the content of that locale

1 Reply

Jamie CeeOP•12mo ago

Or on an alternative approach, looking into live form updating. I can see the documentation has this:

Select::make('type')
    ->options([
        'employee' => 'Employee',
        'freelancer' => 'Freelancer',
    ])
    ->live()
    ->afterStateUpdated(fn (Select $component) => $component
        ->getContainer()
        ->getComponent('dynamicTypeFields')
        ->getChildComponentContainer()
        ->fill())
    
Grid::make(2)
    ->schema(fn (Get $get): array => match ($get('type')) {
        'employee' => [
            TextInput::make('employee_number')
                ->required(),
            FileUpload::make('badge')
                ->image()
                ->required(),
        ],
        'freelancer' => [
            TextInput::make('hourly_rate')
                ->numeric()
                ->required()
                ->prefix('€'),
            FileUpload::make('contract')
                ->required(),
        ],
        default => [],
    })
    ->key('dynamicTypeFields')

Select::make('type')
    ->options([
        'employee' => 'Employee',
        'freelancer' => 'Freelancer',
    ])
    ->live()
    ->afterStateUpdated(fn (Select $component) => $component
        ->getContainer()
        ->getComponent('dynamicTypeFields')
        ->getChildComponentContainer()
        ->fill())
    
Grid::make(2)
    ->schema(fn (Get $get): array => match ($get('type')) {
        'employee' => [
            TextInput::make('employee_number')
                ->required(),
            FileUpload::make('badge')
                ->image()
                ->required(),
        ],
        'freelancer' => [
            TextInput::make('hourly_rate')
                ->numeric()
                ->required()
                ->prefix('€'),
            FileUpload::make('contract')
                ->required(),
        ],
        default => [],
    })
    ->key('dynamicTypeFields')

However, The options of my form will be dynamic from a model... so how can I do the second part where the keys are filled with dynamic content. So if the option changes to spanish, I want to load the content from the pivot table where the locale is "es" if I change my value with the code setup, I get

Call to a member function getChildComponentContainer() on null

Call to a member function getChildComponentContainer() on null

If I remove that line, I get call fill() on null. This is my code

                Grid::make()
                    ->schema([
                        Forms\Components\Select::make('locale')
                            ->options(function () {
                                return Locales::all()->pluck('title', 'locale');
                            })
                            ->default(function () {
                                return Locales::where('locale', 'en')->first()->getKey();
                            })
                            ->hiddenOn(['create', 'view'])
                            ->live()
                            ->afterStateUpdated(fn (Select $component) => $component
                                ->getContainer()
                                ->getComponent('dynamicTypeFields')
                                ->getChildComponentContainer()
                                ->fill())
                    ]),

                Grid::make()
                    ->schema(fn (Get $get): array => match ($get('locale')) {
                        'es' => [
                            Forms\Components\TextInput::make('employee_number')
                                ->required(),
                        ],
                        'en' => [],
                        default => [
                            Forms\Components\TextInput::make('title')
                                ->required()
                                ->maxLength(100),
                        ],
                    })

                Grid::make()
                    ->schema([
                        Forms\Components\Select::make('locale')
                            ->options(function () {
                                return Locales::all()->pluck('title', 'locale');
                            })
                            ->default(function () {
                                return Locales::where('locale', 'en')->first()->getKey();
                            })
                            ->hiddenOn(['create', 'view'])
                            ->live()
                            ->afterStateUpdated(fn (Select $component) => $component
                                ->getContainer()
                                ->getComponent('dynamicTypeFields')
                                ->getChildComponentContainer()
                                ->fill())
                    ]),

                Grid::make()
                    ->schema(fn (Get $get): array => match ($get('locale')) {
                        'es' => [
                            Forms\Components\TextInput::make('employee_number')
                                ->required(),
                        ],
                        'en' => [],
                        default => [
                            Forms\Components\TextInput::make('title')
                                ->required()
                                ->maxLength(100),
                        ],
                    })

                    ->afterStateUpdated(function (Select $component, $record) {
                        $dynamicTypeFieldsComponent = $component
                            ->getContainer()
                            ->getComponent('dynamicTypeFields')
                            ->getChildComponentContainer();

                        $selectedLocale = $component->getState();

                        if ($record->locales()->where('locales_offer.locale', $selectedLocale)->exists()) {
                            $translated = $record->locales()->where('locales_offer.locale', $selectedLocale)->first();
                            $translated = $translated->pivot->title;
                        } else {
                            $translated = $record->title;
                        }

                        $dynamicTypeFieldsComponent->getParentComponent('title')->fill($translated);
                    }),

                    ->afterStateUpdated(function (Select $component, $record) {
                        $dynamicTypeFieldsComponent = $component
                            ->getContainer()
                            ->getComponent('dynamicTypeFields')
                            ->getChildComponentContainer();

                        $selectedLocale = $component->getState();

                        if ($record->locales()->where('locales_offer.locale', $selectedLocale)->exists()) {
                            $translated = $record->locales()->where('locales_offer.locale', $selectedLocale)->first();
                            $translated = $translated->pivot->title;
                        } else {
                            $translated = $record->title;
                        }

                        $dynamicTypeFieldsComponent->getParentComponent('title')->fill($translated);
                    }),

Why is my value of title not updating. $translated has valid content. And the getParentComponent does return the correct TextInput Nevermind.

Gaming

Programming

select input for actions