Richeditor live update

Hey everyone!

I'm running into a weird issue with Filament forms and could use some help. I have a Select field that's set to

->live()

->live()

and a RichEditor that should reactively update when the select value changes, but the RichEditor isn't triggering its query when I change the select option.

Here's my code:

Select::make('from')
    ->label(__('From'))
    ->live()
    ->options(function () {
        return Channel::where('user_id', auth()->id())
            ->where('type', 'imap')
            ->pluck('name', 'id');
    })
    ->required(),
RichEditor::make('body')
    ->label(__('Message'))
    ->reactive()
    ->toolbarButtons([
        'blockquote',
        'bold',
        'bulletList',
        'codeBlock',
        'h2',
        'h3',
        'italic',
        'link',
        'orderedList',
        'redo',
        'strike',
        'underline',
        'undo',
    ])
    ->formatStateUsing(fn(Get $get) => '<br><br>' . Channel::find($get('from'))?->settings['signature'] ?? '')
    ->required()

Select::make('from')
    ->label(__('From'))
    ->live()
    ->options(function () {
        return Channel::where('user_id', auth()->id())
            ->where('type', 'imap')
            ->pluck('name', 'id');
    })
    ->required(),
RichEditor::make('body')
    ->label(__('Message'))
    ->reactive()
    ->toolbarButtons([
        'blockquote',
        'bold',
        'bulletList',
        'codeBlock',
        'h2',
        'h3',
        'italic',
        'link',
        'orderedList',
        'redo',
        'strike',
        'underline',
        'undo',
    ])
    ->formatStateUsing(fn(Get $get) => '<br><br>' . Channel::find($get('from'))?->settings['signature'] ?? '')
    ->required()

Has anyone encountered this before? Am I missing something obvious?

Thanks in advance for any help!

Solution

I think you need to set on afterStateUpdated on the select. so

Select::make('from')
    ->label(__('From'))
    ->live()
    ->options(function () {
        return Channel::where('user_id', auth()->id())
            ->where('type', 'imap')
            ->pluck('name', 'id');
    })
  ->afterStateUpdated(fn($state, Set $set) => $set('body', '<br><br>' . Channel::find($state)?->settings['signature']) ?? '')
    ->required(),

Select::make('from')
    ->label(__('From'))
    ->live()
    ->options(function () {
        return Channel::where('user_id', auth()->id())
            ->where('type', 'imap')
            ->pluck('name', 'id');
    })
  ->afterStateUpdated(fn($state, Set $set) => $set('body', '<br><br>' . Channel::find($state)?->settings['signature']) ?? '')
    ->required(),

Jump to solution

Richeditor live update

Hey everyone!

I'm running into a weird issue with Filament forms and could use some help. I have a Select field that's set to

->live()

->live()

and a RichEditor that should reactively update when the select value changes, but the RichEditor isn't triggering its query when I change the select option.

Here's my code:

Select::make('from')
    ->label(__('From'))
    ->live()
    ->options(function () {
        return Channel::where('user_id', auth()->id())
            ->where('type', 'imap')
            ->pluck('name', 'id');
    })
    ->required(),
RichEditor::make('body')
    ->label(__('Message'))
    ->reactive()
    ->toolbarButtons([
        'blockquote',
        'bold',
        'bulletList',
        'codeBlock',
        'h2',
        'h3',
        'italic',
        'link',
        'orderedList',
        'redo',
        'strike',
        'underline',
        'undo',
    ])
    ->formatStateUsing(fn(Get $get) => '<br><br>' . Channel::find($get('from'))?->settings['signature'] ?? '')
    ->required()

Select::make('from')
    ->label(__('From'))
    ->live()
    ->options(function () {
        return Channel::where('user_id', auth()->id())
            ->where('type', 'imap')
            ->pluck('name', 'id');
    })
    ->required(),
RichEditor::make('body')
    ->label(__('Message'))
    ->reactive()
    ->toolbarButtons([
        'blockquote',
        'bold',
        'bulletList',
        'codeBlock',
        'h2',
        'h3',
        'italic',
        'link',
        'orderedList',
        'redo',
        'strike',
        'underline',
        'undo',
    ])
    ->formatStateUsing(fn(Get $get) => '<br><br>' . Channel::find($get('from'))?->settings['signature'] ?? '')
    ->required()

Has anyone encountered this before? Am I missing something obvious?

Thanks in advance for any help!

Solution

I think you need to set on afterStateUpdated on the select. so

Select::make('from')
    ->label(__('From'))
    ->live()
    ->options(function () {
        return Channel::where('user_id', auth()->id())
            ->where('type', 'imap')
            ->pluck('name', 'id');
    })
  ->afterStateUpdated(fn($state, Set $set) => $set('body', '<br><br>' . Channel::find($state)?->settings['signature']) ?? '')
    ->required(),

Select::make('from')
    ->label(__('From'))
    ->live()
    ->options(function () {
        return Channel::where('user_id', auth()->id())
            ->where('type', 'imap')
            ->pluck('name', 'id');
    })
  ->afterStateUpdated(fn($state, Set $set) => $set('body', '<br><br>' . Channel::find($state)?->settings['signature']) ?? '')
    ->required(),

Jump to solution

Richeditor live update

Richeditor live update

Similar Threads

Similar Threads

Similar Threads