Radical lazy/defer load on collapsible column.
I have been 3 days trying to solve this and I couldn't found any way. Maybe is very simple.
I have a Table inside a Widget. That table has some visible rows and for each row one collapsible Panel/View/CustomColumn (whatever, I tried them all, don't really mind).
Now, the collapsible row shows a VERY EXPENSIVE GRAPH. So expensive that I don't want that graph to be prefetched, and I don't mind if the user needs to wait some seconds before getting it.
Don't want the system to ask for 30 of those graphs to the server just in case some user decides to look at one of them.
Now... with old school jquery/javascript I could create unique id's for recepting divs and make show buttons call some DOM modifier that asked the server for the graph data and then showed it into the div's location.
...but... with livewire... I have no control.
Things I tried:
I tried to find a way to get the info of Alpine.js isCollapsed variable into my CustomColumn extends Colum or into the blade view.... If I know if the given row element is collapsed, I might be able to return a very different thing.
Couldn't find a way to read Apline.js status from CustomColumn. Entangled did not work OR works with another object (maybe the widget) not with the column object.
Couldn't find a way to pass this isCollapsed variable value by any other way or using javascript or anyway. I see there are some ways to pass livewire vars to alpine.js, but I see no way to get that isCollapsible (or maybe a way to know if the dom subtree is hidden?)
Couldn't find a proper way to do a real lazy/defer method so I only get the Column when It ends being hidden in the dom. wire:init="loadData" do not work, first because it is not the Column method that is called, but the Widget method. Don't know how to inform the column method from the widget one.
I have a Table inside a Widget. That table has some visible rows and for each row one collapsible Panel/View/CustomColumn (whatever, I tried them all, don't really mind).
Now, the collapsible row shows a VERY EXPENSIVE GRAPH. So expensive that I don't want that graph to be prefetched, and I don't mind if the user needs to wait some seconds before getting it.
Don't want the system to ask for 30 of those graphs to the server just in case some user decides to look at one of them.
Now... with old school jquery/javascript I could create unique id's for recepting divs and make show buttons call some DOM modifier that asked the server for the graph data and then showed it into the div's location.
...but... with livewire... I have no control.
Things I tried:
I tried to find a way to get the info of Alpine.js isCollapsed variable into my CustomColumn extends Colum or into the blade view.... If I know if the given row element is collapsed, I might be able to return a very different thing.
Couldn't find a way to read Apline.js status from CustomColumn. Entangled did not work OR works with another object (maybe the widget) not with the column object.
Couldn't find a way to pass this isCollapsed variable value by any other way or using javascript or anyway. I see there are some ways to pass livewire vars to alpine.js, but I see no way to get that isCollapsible (or maybe a way to know if the dom subtree is hidden?)
Couldn't find a proper way to do a real lazy/defer method so I only get the Column when It ends being hidden in the dom. wire:init="loadData" do not work, first because it is not the Column method that is called, but the Widget method. Don't know how to inform the column method from the widget one.