Livewire / Custom Page issue / skipRender not functioning?
Hi all, looking for some help. I have a custom page and I am evolving its functionality. It's a simple search page and it returns results and presents a "heart" icon that can be clicked to indicate a "like" - turns to red.
Whenever the heart is clicked it results in part of the page being re-rendered (and the heart returns to its un-clicked state).
Please see video
https://www.loom.com/share/498ad9e4e57e4dbb93dc839a4c97d0ae?sid=965c6fd4-1e60-4f3e-b8e7-8676f7c92221
My blade code has an SVG
The javascript function
Note the Livewire.dispatch - this is firing - and is executing this function within the page's controller
As I understand it when you call a function within the controller, the blade gets re-rendered and I had hoped that adding the line
However this doesn't seem to make a difference - and so I wondered if perhaps the problem is one of the combination of the controller being a Filament page using livewire as opposed to a livewire component.
A bit puzzled about how to proceed right now would appreciate any and all suggestions.
thanks,
j
Whenever the heart is clicked it results in part of the page being re-rendered (and the heart returns to its un-clicked state).
Please see video
https://www.loom.com/share/498ad9e4e57e4dbb93dc839a4c97d0ae?sid=965c6fd4-1e60-4f3e-b8e7-8676f7c92221
My blade code has an SVG
<svg id="heroicon{{ $result->id }}"
onclick="changeIconColor('{{ $result->id }}', event)" >
...
</svg>
The javascript function
changeIconColorfunction changeIconColor(id, event) {
const heroicon = document.getElementById();
const currentFill = window.getComputedStyle(heroicon).getPropertyValue('fill');
if (currentFill == 'none')
heroicon.style.fill = 'red';
else
heroicon.style.fill = 'none';
Livewire.dispatch('toggle-state', {
id: id,
isActive: true
})
}Note the Livewire.dispatch - this is firing - and is executing this function within the page's controller
public function toggleState($id, $isActive)
{
$this->skipRender();
...
}
As I understand it when you call a function within the controller, the blade gets re-rendered and I had hoped that adding the line
$this->skipRender(); However this doesn't seem to make a difference - and so I wondered if perhaps the problem is one of the combination of the controller being a Filament page using livewire as opposed to a livewire component.
A bit puzzled about how to proceed right now would appreciate any and all suggestions.
thanks,
j
Laravel
A full-stack framework for Laravel that takes the pain out of building dynamic UIs.
