Hello, I am looking to implement dynamic grouping of columns in the dataGrid component. I have tried using GroupColumn and column widget components from the Grid. I placed them inside a list to achieve the format below, but I am unable to bind data to it. Does anyone know how I can implement this? Is there another way to achieve dynamic grouping? Your help would be greatly appreciated. Thanks in advance!
Hi @Swapnaja Patil,
To achieve dynamic grouping in the Data Grid component, follow these steps:
1) Use the Data Grid Column API:
The OutSystems Data Grid component supports column grouping, but you need to ensure you're properly binding data to the columns dynamically. The API allows you to programmatically manage columns, including grouping them.
2) Bind Data Dynamically:
You’ll need to ensure that each column you add dynamically is linked to the correct data fields. One way to achieve this is by using the 'SetColumns' method available through the Grid API. Example:
grid.setColumns([
{ id: 'column1', name: 'Column 1', field: 'dataField1', group: 'Group 1' },
{ id: 'column2', name: 'Column 2', field: 'dataField2', group: 'Group 2' },
// More dynamic columns
]);
3) Nested Groups:
For creating nested groups (like SubGroup1 and SubGroup2), you need to configure the hierarchy of columns and ensure they are properly nested in the configuration. You can achieve this by nesting the group properties, for example:
{ id: 'subgroup1', name: 'SubGroup 1', field: 'dataFieldSub1', group: 'Group 1' },
{ id: 'subgroup2', name: 'SubGroup 2', field: 'dataFieldSub2', group: 'Group 2' },
{ id: 'column3', name: 'Column 3', field: 'dataField3', group: 'SubGroup1' },
{ id: 'column4', name: 'Column 4', field: 'dataField4', group: 'SubGroup2' }
4) Ensure Proper Data Binding:
When binding data, ensure that the data source structure matches the columns you've defined dynamically. This could mean ensuring that your JSON or structure objects have the appropriate field names that correspond to the columns.
5) Use Aggregation if Needed:
If you need to aggregate the grouped columns (e.g., sum, average), check the Group Aggregation settings available within the Data Grid, which allow for grouping by column values.
Hope this helps!
Regards,
Abhinav
Hello @Abhinav Shilwant,
Thanks for your reply.
.I tried using this API
OutSystems.GridAPI.GridManager.GetActiveGrid().setColumns() and
OutSystems.GridAPI.GridManager.GetActiveGrid()._columnsSet.Set(),
but this is giving me error. Could you please give me more details about the API?
Thank you!
Let me check and get back to you.
Thanks Abhinav.
@Swapnaja Patil
It looks like the issue you’re encountering is related to the use of _columnsSet.Set(). The error suggests that Set is not a function, which likely means that the method you’re trying to invoke doesn’t exist in the current context or the object you are calling it on is not what you expect.
Here are a few things to check:
1) Verify the API documentation: Ensure that Set() is a valid method for _columnsSet. Sometimes, the method signatures or available methods might differ, or they may be updated in different versions.
2) Debug the object: Try to log OutSystems.GridAPI.GridManager.GetActiveGrid()._columnsSet to inspect what methods or properties are available in this object. This might give you more insight into what the actual structure is.
3) Use setColumns() properly: If setColumns() is the intended method, ensure that you are passing the correct argument structure to this function. Typically, this method expects a proper configuration of columns to be passed in as an argument.
If you’re still stuck, feel free to share more details, and I’d be happy to assist further!