Dynamic accordian datatables

Webix JS
1

I have some project data where each row is: project name, task id, task title, etc

What I am trying to do is an accordian for each project name with a datatable in each accordian with the task information. This have have working but it is only for a single accordian.

What I am really struggling with is how to dynamically repeat that with x accordians.

I really welcome any help.

2

I actually fixed this with Javascript by wrapping the ui call in a loop. Not elegant but it works :slight_smile:

3

It looks like you need to make webix.copy of data (or config) for each accordion item.

4

You can use a subview in the datatable, as result each row of projects grid can be expanded to show tasks info.

http://docs.webix.com/datatable__subviews.html

As alternative you can build UI dynamically, something like following

var projects = [...];
var rows = [];
var taskview = { view:"datatable", ... };

//add a panel for each project
for (var i=0; i<projects.length; i++)
   rows.push({ head:"Some", body: webix.copy(taskview) });

//init the resulting UI
webix.ui({ rows:rows })