Reset form field after custom submit in modal action

public function table(Table $table): Table
    {
        return $table
            ->columns([
                Tables\Columns\TextColumn::make('oldestMessage.message')
                    ->label('Question'),
            ])
            ->filters([
                SelectFilter::make('status')
                    ->options(ChatSessionStatus::dropdown())->default(ChatSessionStatus::Unanswered->value),
            ])
            ->headerActions([
                Tables\Actions\CreateAction::make(),
            ])
            ->actions([
                Tables\Actions\EditAction::make(),
                Tables\Actions\DeleteAction::make(),
                Action::make('Reply')
                    ->form([
                        TextInput::make('replyMessage')
                            ->required()
                            ->live()
                    ])
                    ->fillForm(fn(ChatSession $record): array => [
                        'replyMessage' => '',
                    ])
                    ->modalHeading(function (ChatSession $record) {
                        return 'Reply to "' . $record->oldestMessage->message . '" from ' . $record->user->name;
                    })
                    ->modalContent(function (ChatSession $record, Action $action) {
                        return view(
                            'filament.chat-messages.chats',
                            ['chatSession' => $record],
                        );
                    })

                    ->extraModalFooterActions(fn(Action $action): array => [
                        $action->makeModalSubmitAction('Reply', arguments: ['halt' => true])
                            ->color('primary'),
                    ])
                    ->action(function ($action, ChatSession $record, array $data, $arguments, Set $set, Get $get) {
                        $chatMessageService = new ChatMessageService();
                        $chatMessageService->create($record->id, $data['replyMessage'], auth()->user()->id);

                        // $set('replyMessage', ''); 
            
                        if ($arguments['halt'] === true) {
                            $action->halt();
                        }

                        // $set('replyMessage', '');
            
                    })
                    ->slideOver()
                    ->modalSubmitAction(false)
            ]);
    }

I am trying to make the input field-replyMessage reset with blank value once the action is completed but I am unable to do because of the following reasons:

If I write it above the halt statement like shown in the above code, I get this error: Typed property Filament\Forms\Components\Component::$container must not be accessed before initialization
And when I write anything below the halt statement, nothing gets executed.

How can I reset the replyMessage field to a blank value when the reply button is submitted? What I am doing wrong? I even tried $this->form->fill(); instead of $set('replyMessage', ''); but it does not work either.

LaryAI

2 years ago

Level 58

To reset the replyMessage field to a blank value after the action is completed, you can use the reset method on the form that is available within the action closure. The reset method will reset the form fields to their initial state. Since you want to reset the replyMessage field after the action is completed, you should call the reset method after the message has been created and before the halt method is called if you want to halt the action.

Here's how you can modify your action method to reset the replyMessage field:

->action(function ($action, ChatSession $record, array $data, $arguments, Set $set, Get $get) {
    $chatMessageService = new ChatMessageService();
    $chatMessageService->create($record->id, $data['replyMessage'], auth()->user()->id);

    // Reset the replyMessage field to its initial state (which is an empty string)
    $action->form->fill([
        'replyMessage' => '',
    ]);

    // If you want to halt the action, do it after resetting the form
    if ($arguments['halt'] === true) {
        $action->halt();
    }
})

In this code snippet, the fill method is used to set the replyMessage field to an empty string, effectively resetting it. This is done before the halt method is called, ensuring that the reset operation is executed regardless of whether the action is halted or not.

Make sure that the fill method is called on the correct form instance ($action->form in this case) and that the field name (replyMessage) matches the name used in the form definition.

This should reset the replyMessage field to a blank value after the action is completed, and before the modal is closed if the halt argument is true.

cxbdia

2 years ago

Level 3

I have tried the following as well

$action->form->fill([
        'replyMessage' => '',
    ]);

but get this error: Cannot access protected property Filament\Tables\Actions\Action::$form

1 like

Please or to participate in this conversation.