UI design pattern headache

erwin16

I wondering how I can display to the user a datable in which one of the colum would be in fact 2 linked list
In each row , the third value " access_value" is an array of groups, each group having multiple functions

My first thought would be to have a group list box, and upon group item selection changing the function list box so the page will consist of

          the datable ( only company name , short_name columns)  --- the select list Groups  --- the select list Functions

selecting a table row will trigger the update of the Groups select list and selecting a group in the list will trigger the Function select list

Is there any better way to do it ? , could it be done in a unique table ?

thanks for you suggestions ...

the json data being something like

    { data : 
        [
            company: "Company A",
            name: "Name A",
                     short_name: "Short NameA",
            access_levels: [ 
                {group: "groupA", functions: [ "function1, function2"]}, 
                {group: "groupB", functions: [ "function3, function4"]}, 
                {group: "groupC", functions: [ "function1, function4"]}
         ],
        [
            company: "Company B",
            name: "Name B",
                     short_name: "Short NameB",
            access_levels: [ 
                {group: "groupD", functions: [ "function28, function29"]}, 
                {group: "groupB", functions: [ "function31, function41"]}, 
                {group: "groupF", functions: [ "function11, function41"]}
         ]
    }

allan

The simplest would be to just concatenate the data and show it all together - e.g. data:access_levels[, ].group(seedt-init columns.data` for the array syntax options).

A more complex option would be to use a child row to show detailed information about the array and just show a summary in the host row.

Allan

erwin16

Thanks Allan .. that's what I'll do : sliding child row seems to be the way to go.. even if it takes more time to study and solve.. the user will not be disturbed ... I'll keep it posted when solved...

erwin16

This is what I intend to code , I guess it's feasible (1) before clicking (2) after clicking ... click in group box list will update the function box list

[before click] ( http://postimg.org/image/o2uhvnse7/ )

[after click] ( http://postimg.org/image/61fyblnr3/ )