How to bind input type hidden with Livewire-CodePudding

In my form I have an input element with type = "hidden". I m updating the value of the element from jQuery triggered by a Drop-Down which is outside the form. I've bind the element with Livewire property using wire:model="examId" but it's not working. when I change the type to text it works.

so how can I bind input type = "hidden" to Livewire or is there any other way to pass the value of the element to Livewire when changed.

<input wire:model="examId" type="hidden" name="examId" id="examId">

CodePudding user response：

Livewire does not listen for updates to hidden inputs, but you can instead emit events to change a property in Livewire. This means you can set the property from any script on that page.

In your JavaScript, emit the event and pass in the data,

let examId = 32;
Livewire.emit('setExamId', examId);

In your component, listen for that event and declare the method which performs the logic of setting that ID,

protected $listeners = ['setExamId'];

public function setExamId($examId)
{
    $this->examId = $examId;
}