What seems to be the problem:
The “status” property of my “Application” model is not bound to my select element and it always resets to the first option, when trying to change the value.
Steps to Reproduce:
See code examples below.
Are you using the latest version of Livewire:
Yes, version 2.4.0
Do you have any screenshots or code examples:
My component:
public array $statuses;
public JobApplication $application;
protected array $rules = [
'application.status' => 'required|string'
];
public function mount()
{
$this->statuses = ['new', 'in-progress', 'invite-to-interview', ...];
}
The component’s view:
<div>
{{ $application->status }}
<select wire:model="application.status">
@foreach($statuses as $status)
<option value="{{ $status }}">{{ $status }}</option>
@endforeach
</select>
</div>
When changing the value of the select element the application status is successfully updated, but the select element does not update correctly. It doesn’t have the right initial value to start with.