Filament•11mo ago

Validate a field inside a modal

I'd like to know if there is a way to validate a field inside a modal window. (which is of course called from an action). I have a Select field that has to be filled in, before executing the action. How can I achieve this? This is my code so far:

Action::make('generate')
  ->link()
  ->slideOver()
  ->icon('heroicon-o-sparkles')
  ->modalWidth('3xl')
  ->modalHeading('Generate')
  ->modalSubmitActionLabel('Save')
  ->closeModalByClickingAway(false)
  ->form([
      Select::make('prompt')
          ->label('Prompt')
          ->required()
          ->reactive()
          ->searchable()
          ->preload()
          ->options(Prompt::all()->pluck('name', 'id')),
  
      RichEditor::make('job_description_original')
          ->disableAllToolbarButtons()
          ->label('Origineel')
          ->default(fn ($livewire) => $livewire->data['job_description']),
      Actions::make([
          Action::make('generate_alternative')
              ->label('Generate')
              ->action(function ($get, $set, $record, $livewire) {

                  // MAKE SURE THERE IS A PROMPT SELECTED?
  
                  $result = GenerateSummary::make()->handle(
                      $get('prompt'),
                      $record->job_title,
                      $get('job_description_original')
                  );
  
                  $set('job_description_alt', $result);
              }),
      ]),
      RichEditor::make('job_description_alt')
          ->disableAllToolbarButtons()
          ->hiddenLabel(),
  ])
  ->action(function (array $data, $set): void {
      $set('job_description', $data['job_description_alt']);
  }),

Action::make('generate')
  ->link()
  ->slideOver()
  ->icon('heroicon-o-sparkles')
  ->modalWidth('3xl')
  ->modalHeading('Generate')
  ->modalSubmitActionLabel('Save')
  ->closeModalByClickingAway(false)
  ->form([
      Select::make('prompt')
          ->label('Prompt')
          ->required()
          ->reactive()
          ->searchable()
          ->preload()
          ->options(Prompt::all()->pluck('name', 'id')),
  
      RichEditor::make('job_description_original')
          ->disableAllToolbarButtons()
          ->label('Origineel')
          ->default(fn ($livewire) => $livewire->data['job_description']),
      Actions::make([
          Action::make('generate_alternative')
              ->label('Generate')
              ->action(function ($get, $set, $record, $livewire) {

                  // MAKE SURE THERE IS A PROMPT SELECTED?
  
                  $result = GenerateSummary::make()->handle(
                      $get('prompt'),
                      $record->job_title,
                      $get('job_description_original')
                  );
  
                  $set('job_description_alt', $result);
              }),
      ]),
      RichEditor::make('job_description_alt')
          ->disableAllToolbarButtons()
          ->hiddenLabel(),
  ])
  ->action(function (array $data, $set): void {
      $set('job_description', $data['job_description_alt']);
  }),

10 Replies

Patrick Boivin•11mo ago

So an empty select doesn't trigger a validation error in this example?

Daniel Plomp•11mo ago

No, that is right. Maybe because it is inside a modal / action? I tried e.g. `$livewire->validateOnly('') but that didn't work either.

Patrick Boivin•11mo ago

Kinda looks like a bug to me... I'll see if I can replicate I'm not 100% sure, but can you try without the ->searchable()?

Daniel Plomp•11mo ago

Hm... that doesn't make any difference, unfortunately.

Patrick Boivin•11mo ago

It's strange, I cannot replicate the issue. It validates for me in the context of a page action.

Daniel Plomp•11mo ago

This Action is in a Form. Did you try that also?

Patrick Boivin•11mo ago

Yeah, seems to work too with a form component action I'd say feel free to open an issue on Github, if you can provide a minimal example repository to reproduce the issue. It could be a bug for your specific use-case.

Daniel Plomp•11mo ago

May I see your working code inside a Form Builder? I could have missed something?

Patrick Boivin•11mo ago

Actions::make([
    Action::make('test')
        ->form([
            Select::make('testing')
                ->options(['one' => 'one', 'two' => 'two'])
                ->required()
        ])
        ->action(function ($data) {
            dd($data);
        }),
]),

Actions::make([
    Action::make('test')
        ->form([
            Select::make('testing')
                ->options(['one' => 'one', 'two' => 'two'])
                ->required()
        ])
        ->action(function ($data) {
            dd($data);
        }),
]),

Daniel Plomp•11mo ago

I see. The difference is that I have an Action inside an Action. Maybe that is the issue.

Gaming

Programming

Validate a field inside a modal