Aggrid how use colSpan? #3621
-
QuestionGood day, I'm trying to create a table with groups and headers by merging several cells, I added the 'is_header' property: True, if it satisfies, then I'm trying to merge several cells in a row into one for the header. The aggrid examples use colSpan. But I couldn’t figure out how to use it correctly in Nicegui. Please need help new_data.append({
'id': None,
'title': parent_names,
'username': '',
'password': '',
'url': '',
'notes': '',
'is_header': True
}) grid = ui.aggrid({
'defaultColDef': {
'flex': 1,
'cellStyle': {'display': 'flex', 'alignItems': 'center'}
},
'columnDefs': [
{'headerName': 'ID', 'field': 'id', 'hide': True},
{
'headerName': 'Title',
'field': 'title',
'cellRenderer': 'agGroupCellRenderer',
'resizable': True,
# colSpan
'colSpan': {
"function": "params.data.is_header === 'true' ? 2 : 1"
}
},
{'headerName': 'Username', 'field': 'username'},
{'headerName': 'Password', 'field': 'password'},
{'headerName': 'URL', 'field': 'url'},
{'headerName': 'Notes', 'field': 'notes'},
],
'rowData': [],
'rowSelection': 'multiple',
}).style('height: 700px').on('cellClicked', on_cell_clicked) With this execution I have an empty table |
Beta Was this translation helpful? Give feedback.
Replies: 2 comments 4 replies
-
Can you, please, try to create a minimum reproducible code example? This would allow us and the community to help more efficiently. Thanks! |
Beta Was this translation helpful? Give feedback.
-
You can define a JavaScript function for the ':colSpan': '(params) => params.data.isCatalog ? 3 : 1', The leading colon |
Beta Was this translation helpful? Give feedback.
You can define a JavaScript function for the
colSpan
property like this:The leading colon
:
indicates a string that needs to be translated to a JavaScript object on the client.