Manipulate stacking order of `dashboard`

Webix JS
#1

I have a dashboard, which I am loading with panels from the database, by looping through my list of panels and calling addView for each panel.

In the dashboard autoplace is set to false, and some panels can overlap or live on top of other panels. I can control the stacking order as the panels are created by ensuring that they come back from the database top panel last (e.g. ORDER BY stacking_order DESC.

I have a datatable that contains a list of the panels currently on the dashboard (arranged by their stacking order). I have drag: true set so that I can re-order the rows.

I want to be able to change the stacking order of the panels as I drag a row in the datatable.

I can get a list of all panels on the datatable by calling let childViews = $$("myDashboard").getChildViews(), and then I can call childViews .splice(newIndex, 0, childViews .splice(oldIndex, 1)[0]); to reorder the childViews array.

Is there a way to tell the dashboard to redraw based on the new panel order?

Thanks.

#2

Hello @mcmurphy510,
It can be done through the zIndexpanels.
Please take a look at the snippet:
https://snippet.webix.com/k9csc7wg
But If you want the index for these panels to remain constant (depending on which one was set), and not change (for example, when dragging), it is impossible, because when dragging the panels themselves, zIndex will change.

#3

Thanks.