Filament•8mo ago

Select not "registering" choice, error saying it's required

Hi! I have made a livewire component that's returning a filament form! It's a Select that gets data from the database and fills it as its options. When I select an option and press submit, it insists that I must choose an option (even though I has chosen one). Here is its code.

public function checkInAction(): Action
    {
        Log::info('submitAction running');

        return Action::make('checkInAction')
            ->label('')
            ->color('success')
            ->icon('tabler-check')
            ->button()
            ->size('lg')
            ->extraAttributes([
                'class' => 'col-span-3',
            ])
            ->form([
                Forms\Components\Select::make('schedule')
                    ->required()
                    ->afterStateUpdated(function (?string $state, ?string $old) {
                        ddd('here');
                    })
                    ->options(function (): array {
                        //  Query the database for the list of schedules
                        // I removed this part due to the discord char limit
                        // It returns an array with the proper data to fill the options
                        // It works and shows it on the front-end
                    }),
            ])
            ->action(function ($data){
                ddd($data);
                Attendance::create(
                    [
                        'member_id' => $this->code,
                        'activity_id' => $data['schedule'],
                        'trainer_id' => 1,
                        'room_id' => 1,
                        'day' => now()->format('N'),
                        'start_time' => now()->format('H:i:s'),
                        'end_time' => now()->addHour()->format('H:i:s'),
                    ]
                );
            });
    }

public function checkInAction(): Action
    {
        Log::info('submitAction running');

        return Action::make('checkInAction')
            ->label('')
            ->color('success')
            ->icon('tabler-check')
            ->button()
            ->size('lg')
            ->extraAttributes([
                'class' => 'col-span-3',
            ])
            ->form([
                Forms\Components\Select::make('schedule')
                    ->required()
                    ->afterStateUpdated(function (?string $state, ?string $old) {
                        ddd('here');
                    })
                    ->options(function (): array {
                        //  Query the database for the list of schedules
                        // I removed this part due to the discord char limit
                        // It returns an array with the proper data to fill the options
                        // It works and shows it on the front-end
                    }),
            ])
            ->action(function ($data){
                ddd($data);
                Attendance::create(
                    [
                        'member_id' => $this->code,
                        'activity_id' => $data['schedule'],
                        'trainer_id' => 1,
                        'room_id' => 1,
                        'day' => now()->format('N'),
                        'start_time' => now()->format('H:i:s'),
                        'end_time' => now()->addHour()->format('H:i:s'),
                    ]
                );
            });
    }

Solution:

Switching the component from a Select to a CheckboxList seems to have fixed the problem

Jump to solution

9 Replies

Dennis Koch•8mo ago

Can you show that validation error?

pegos•8mo ago

The {field name} is required

Dennis Koch•8mo ago

Is this maybe because of your ddd() call?

ChesterS•8mo ago

Hmm the code is correct. I'd double-check to make sure the options query is correct (check if the underlying <select> has correct value attributes), remove the afterStateUpdate stuff and see what reaches the action() call. Also, check the value that actually hits the validator I guess. But yeah, the code is correct - I tried the exact same setup and it works

    public function checkInAction(): Action
    {
        return Action::make('checkInAction')
            ->label('Click me')
            ->color('success')
            ->button()
            ->form([
               Select::make('schedule')
                   ->label('Πρόγραμμα')
                    ->required()
                    ->options([1 => 'Foo', 2 => 'Bar', 3 => 'Baz']),
            ])
            ->action(function ($data) {
                dump($data);
            });
    }

    public function checkInAction(): Action
    {
        return Action::make('checkInAction')
            ->label('Click me')
            ->color('success')
            ->button()
            ->form([
               Select::make('schedule')
                   ->label('Πρόγραμμα')
                    ->required()
                    ->options([1 => 'Foo', 2 => 'Bar', 3 => 'Baz']),
            ])
            ->action(function ($data) {
                dump($data);
            });
    }

pegos•8mo ago

The ddd is there for debug purposes it didn't work even before adding it Hmm okay I'll give it a try and update you tomorrow I tried this and I'm getting the same error as before, If I remove the required and try to proceed it just dumps the "schedule" as null

Solution

pegos•8mo ago

Switching the component from a Select to a CheckboxList seems to have fixed the problem

pegos•8mo ago

It's not the ideal solution for me, as it makes no sense as to why Select does not work

ChesterS•8mo ago

Ok this might be stupid but check if there are any other properties in your component that are affecting it. eg if you have a property called $messages, it might affect the validation messages. Anyway, good luck

Hussain4real•8mo ago

the issue is with the date validation

Gaming

Programming

Select not "registering" choice, error saying it's required