Filament•13mo ago

Filament Reactive not Working

My repeater component visibility and requiribility is dependant of my select component. What I do: 1. Make both element reactive 2. Use Callable $get What I expect: 1. It start with the repeater showing because default value is 1 2. As soon as I change my select value, repeater become hidden because value is no longer 1 3. As soon as I put it back to 1, the repeater pops up back Problem: 1. Works perfectly 2. Works Perfectly 3. Doesn't want to show it anymore at all Code:

  public static function form(Form $form): Form
    {
        return $form
            ->columns(3)
            ->schema([
Forms\Components\Select::make('exercise_type_id')->label("Question Type")
->relationship('exerciseType', 'name')
                    ->reactive()
                    ->default(1)
                    ->required(),
Forms\Components\RichEditor::make("question")->columnSpan(3)->required(),  
Forms\Components\RichEditor::make("explanation")->columnSpan(3),                
            Repeater::make('answerlist')
            ->defaultItems(4)
            ->relationship('multipleChoiceAnswers')
            ->label("Multiple Choice Answer Option")
                ->grid(2)
            ->schema([
Forms\Components\TextInput::make('text')->label("Text Answer"),
Forms\Components\FileUpload::make('img')->label("Image Answer")
                ->directory('module-images')
                ->storeFileNamesIn("original_filename"),
Forms\Components\Checkbox::make('is_correct_option')->label("Mark Answer As Correct")->default(false),            
            ])->columnSpan(3)->required(fn(Callable $get) => ($get('exercise_type_id') == 1))->hidden(fn(Callable $get) => ($get('exercise_type_id') !== 1))->reactive(),
            ]);
    }

  public static function form(Form $form): Form
    {
        return $form
            ->columns(3)
            ->schema([
Forms\Components\Select::make('exercise_type_id')->label("Question Type")
->relationship('exerciseType', 'name')
                    ->reactive()
                    ->default(1)
                    ->required(),
Forms\Components\RichEditor::make("question")->columnSpan(3)->required(),  
Forms\Components\RichEditor::make("explanation")->columnSpan(3),                
            Repeater::make('answerlist')
            ->defaultItems(4)
            ->relationship('multipleChoiceAnswers')
            ->label("Multiple Choice Answer Option")
                ->grid(2)
            ->schema([
Forms\Components\TextInput::make('text')->label("Text Answer"),
Forms\Components\FileUpload::make('img')->label("Image Answer")
                ->directory('module-images')
                ->storeFileNamesIn("original_filename"),
Forms\Components\Checkbox::make('is_correct_option')->label("Mark Answer As Correct")->default(false),            
            ])->columnSpan(3)->required(fn(Callable $get) => ($get('exercise_type_id') == 1))->hidden(fn(Callable $get) => ($get('exercise_type_id') !== 1))->reactive(),
            ]);
    }

1 Reply

Dennis Koch•13mo ago

Try to use != instead of !==. Livewire uses strings a lot so you can’t go strict comparison

Gaming

Programming

Filament Reactive not Working