Clearing Textarea Field

Having a small issue trying to clear a textarea of its content after a reply has been submitted.

Ive tried:

$this->reply = ''
$this->reply = null
$this->reply = 'Im gonna headbutt the screen if you dont disappear' :smile:

Here’s the full contents of the function:


# Reply
  'userID' => Auth::user()->id,
  'threadID' => $this->threadID,
  'description' => $this->reply,

# Close Form
$this->showReply = false;

# Update The Component 

# Display Toast
$this->dispatchBrowserEvent('toast', [
  'message' => 'Reply posted.',
  'type' => 'success',

# Empty Reply Field (Or try anyway LOL)

PS: I didnt try the last one but I feel like I’m gonna try it shortly :smile:

Hey, @AtomCoder

Is the textarea has initial value?


<textarea>{{ $this->reply }}</textarea>

Can you paste the full code?


Eh, no it doesnt have a value initially

<textarea wire:model.lazy="reply" class="forum-reply @error('reply') error @enderror" placeholder="Post a reply..."></textarea>

In general cases what you do is the following:

in Reply Component

public $reply = '';

public function reply()
    // reply
   $this->reply = '';

But, you can debug your own code after and before the reply for example

public function reply()
     // reply
     $this->reply = '';
     if (empty($this->reply) {

You can come up with a solution while debug your own code and understand how it works behind the since.

1 Like


Yea thats what I do but for whatever reason its not clearing it.

Ive tried the dump and it is dumping “empty”, but the text remains in the text field.

So weird!

Have you checked the response?

Yes its running the dd() function.

When I add $this->reply = ''; to the render method, its removing the text as expected, but thats not ideal as I want to be able to open/close the reply box and keep the text in the text area, only removing the text after the form is submitted.

Solved this.

I was using wire:model.lazy on the textarea and it was updating the value when I posted the post and for some reason it kept the last value.

I used wire:model.defer and that solved all the issues.

Thanks @skywalker for your help as always!

Cool! I’m glade you solved your issue.

I have been using *.lazy in the model binding and I have no issue with it, It’s weird but the most important thing, the issue was solved :smile:

Yea me too but in this instance for some reason ‘lazy’ doesnt want to do any work lol.