Hi guys
As we know, there's a problem with Kendo UI charts (and gauges and other widgets) being rendered that are underneath tabs. On load, the chart is unable to detect the size of it's parent container and defaults to 600 width.
So as a workaround, I'd like to bind an event to my tabs (Bootstrap NavBar) that refreshes EVERY Kendo UI chart/gauge etc onscreen at once. This code will go into a controller that will control multiple dashboards with configurable charts - so it's impossible to know ahead of time the IDs of the charts, or the count. There may be no charts, or 50.
That means I need some method of retrieving all Kendo UI objects (or all charts, all gauges, whatever) on the screen at once, preferably as an array so that I can iterate through this array and call refresh() on them.
The pages are being generated by PHP, so I don't have any selectors available. I'd like to place this code onto the bottom of the template so it's a 'drop-in', if possible.
I tried looking at the common classes, such as k-chart, when but I pushed that into a jQuery selector I was unable to call refresh().
Does anyone have any ideas on how I might accomplish this?
As we know, there's a problem with Kendo UI charts (and gauges and other widgets) being rendered that are underneath tabs. On load, the chart is unable to detect the size of it's parent container and defaults to 600 width.
So as a workaround, I'd like to bind an event to my tabs (Bootstrap NavBar) that refreshes EVERY Kendo UI chart/gauge etc onscreen at once. This code will go into a controller that will control multiple dashboards with configurable charts - so it's impossible to know ahead of time the IDs of the charts, or the count. There may be no charts, or 50.
That means I need some method of retrieving all Kendo UI objects (or all charts, all gauges, whatever) on the screen at once, preferably as an array so that I can iterate through this array and call refresh() on them.
The pages are being generated by PHP, so I don't have any selectors available. I'd like to place this code onto the bottom of the template so it's a 'drop-in', if possible.
I tried looking at the common classes, such as k-chart, when but I pushed that into a jQuery selector I was unable to call refresh().
Does anyone have any ideas on how I might accomplish this?