Hi,
I am using Bryntum grid trial version so each day I am struggling to learn some new features.
Today I am trying to show dropdown with multiple column(look like grid) on click of a column in editor mode
Onclick of the grid column field its showing dropdown with multiple column so plz suggest how can I achieve this
Sounds like you need the TreeCombo Widget:
new TreeCombo({
label : 'Pick task(s)',
width : '30em',
appendTo : document.body,
picker : {
// Define the columns to show in the grid
columns : [
{ type : 'tree', text : 'Tasks', field : 'name', flex : 1 },
{ text : 'Priority', field : 'prio' }
]
},
chipView : {
// Render the chips in the combo field
itemTpl(record) {
return StringHelper.xss`${record.name}`;
}
},
store : {
fields : [
'prio'
],
data : [
{
name : 'Development Tasks',
expanded : true,
children : [
{ id : 1, name : 'Improve React docs', prio : 'High' },
{ id : 2, name : 'Build Angular module', prio : 'Low' },
{ id : 3, name : 'Creat Vue project', prio : 'Low' }
]
},
{ name : 'Customer meeting', prio : 'Normal' },
{
name : 'Customer Tasks',
expanded : true,
children : [
{ id : 4, name : 'Intro meeting', prio : 'Normal' },
{ id : 5, name : 'Build POC', prio : 'High' },
{ id : 6, name : 'Documentation', prio : 'Low' }
]
}
]
}
});
Hi Mats,
Thanks for your reply but can you please explain how can I use the treecombo in my grid with dynamic data(from api for grid and treecombo both).
Or please provide some demo link where treecombo is used in grid column edior like
{
text: "Location",
children: [
{
text: "Column1", field: "testField", editor: true, width: 315, htmlEncode: false,
editor: {
type: 'treecombo', store: myapiStore
}
}
]
}
