Hello comunity!
I am trying to emit event to sibling component to add a row calling addRow() function but doesn’t work.
My component is panel.blade.php. The html is render from javascript here.
Yes it calls the listener function but it doesn’t work! row is not added. I have to add a row from here
<script>
const cavities = @json($cavities);
document.addEventListener("livewire:load", graphic)
function cavitySelected({ target }){
let id = target.getAttribute('cavity-id');
Livewire.emit('svg:click', id);
}....
this action works fine! course-treatment.blade.php. click addRow()
<thead class="bg-primary text-white">
<tr>
<th class="text-center">Note</th>
<th class="text-center bg-success">
<a href="javascript:void(0)" class="text-white" wire:click="addRow()">
<i class="bx bx-plus"></i>
</a>
</th>
</tr>
</thead>
<tbody>
@foreach ($coursesTreatments as $item)
<tr>
<td class="text-right">
<textarea class="form-control" rows="2">{{ $item['treatment'] }}</textarea>
</td>
<td class="text-center">
<a href="javascript:void(0)" class="btn btn-sm btn-danger delete-row">×</a>
</
</tr>
@endforeach
</tbody>
functions in CourseTreatment.php
protected $listeners = [
'svg:click' => 'addRow'
];
public $coursesTreatments = [];
public function render()
{
return view('livewire.history.course-treatment')->with([
'cavities' => Cavity::all()
]);
}
public function addRow($id = 0)
{
array_push($this->coursesTreatments, [
'cavity_id' => $id,
'treatment' => '',
]);
}