Level 122
try
$this->reset(['form.name', 'form.email', 'form.phone_no', 'form.subject', 'form.message']);
or even just
$this->reset(['form']);
Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.
This is my validation
<?php
namespace App\Livewire\Forms;
use App\Models\Contact;
use Livewire\Attributes\Validate;
use Livewire\Form;
class PostForm extends Form
{
#[Validate(['required', 'string'])]
public $name = null;
#[Validate(['required', 'string', 'email'])]
public $email = null;
#[Validate(['required', 'string'])]
public $phone_no = null;
#[Validate(['required', 'string'])]
public $subject = null;
#[Validate(['required', 'string'])]
public $message = null;
public function store()
{
$this->validate();
Contact::create($this->all());
// Reset form fields
$this->resetForm();
}
public function resetForm()
{
$this->reset(['name', 'email', 'phone_no', 'subject', 'message']);
}
}
<?php
namespace App\Livewire;
use App\Livewire\Forms\PostForm;
use Livewire\Component;
class ContactForm extends Component
{
public PostForm $form;
public function save()
{
$this->validate();
$this->form->store();
// Reset form fields
$this->form->resetForm();
// Dispatch success message
$this->dispatch('swal', [
'title' => 'Message has been sent.',
'icon' => 'success',
'iconColor' => 'blue',
]);
}
public function render()
{
return view('livewire.contact-form');
}
}
<form wire:submit.prevent="save">
<div class="row gx-4">
<div class="col-md-6">
<div class="form-floating mb-4">
<input id="name" type="text" wire:model.blur="form.name" class="form-control" placeholder="Jane">
<label for="name">Name *</label>
@error('form.name')
<div class="text-red">{{ $message }}</div>
@enderror
</div>
</div>
<!-- /column -->
<div class="col-md-6">
<div class="form-floating mb-4">
<input id="email" type="email" wire:model.blur="form.email" class="form-control"
placeholder="[email protected]">
<label for="email">Email *</label>
@error('form.email')
<div class="text-red">{{ $message }}</div>
@enderror
</div>
</div>
<!-- /column -->
<div class="col-md-6">
<div class="form-floating mb-4">
<input id="subject" type="text" wire:model.blur="form.subject" class="form-control"
placeholder="Website required.">
<label for="subject">Subject *</label>
@error('form.subject')
<div class="text-red">{{ $message }}</div>
@enderror
</div>
</div>
<!-- /column -->
<div class="col-md-6">
<div class="form-floating mb-4">
<input id="phone_no" type="text" wire:model.blur="form.phone_no" class="form-control"
placeholder="Website required.">
<label for="phone_no">Phone No. *</label>
@error('form.phone_no')
<div class="text-red">{{ $message }}</div>
@enderror
</div>
</div>
<!-- /column -->
<div class="col-12">
<div class="form-floating mb-4">
<textarea id="form_message" wire:model.blur="form.message" class="form-control" placeholder="Your message"
style="height: 150px"></textarea>
<label for="form_message">Message *</label>
<div class="valid-feedback"> Looks good! </div>
<div class="invalid-feedback"> Please enter your message. </div>
</div>
@error('form.message')
<div class="text-red">{{ $message }}</div>
@enderror
</div>
<!-- /column -->
<div class="col-12">
<input type="submit" class="btn btn-primary rounded-pill btn-send mb-3" value="Send message">
<p class="text-muted"><strong>*</strong> These fields are required.</p>
</div>
<!-- /column -->
</div>
<!-- /.row -->
</form>
I tried in many ways everything works fine but form reset is not working.
Please or to participate in this conversation.