jqxGrid Grouping with Aggregates dynamically bind datafield to column

[smithaParticipant]

Hello,

I have a requirement where i need to group by one column but need to display other column values in that grouped by column.
Is it possible to bind datafield for a column dynamically?
I’m using Angular 6 components and jqwidgets-framework version:5.7.2

Currently i’m getting the grid like below –

And i need a grid like this –

[MartinParticipant]

Hello smitha,

Can you, please, give a more detailed description of what you would like to achieve?
It is not very clear from the screenshots, where are these values coming from.
It would be nice if you can send an example with your code.

Best Regards,
Martin

jQWidgets Team
http://www.jqwidgets.com/

[smithaParticipant]

Hello Martin,

My json data looks like this –
[
{
“PartnerBudgetID”: 1,
“Partner_BU_Name”: “Total”,
“Last_Period_Sellout”: 114580032.999146998,
“Sellout_Silver_Below”: 58468333.753999999,
“Sellout_Gold_Platinum”: 210121574.957099996,
“Unweighted_Sellout”: 268589908.711099995
},
{
“PartnerBudgetID”: 1,
“Partner_BU_Name”: “Total”,
“BU_Name”: “Compute”,
“Last_year_MGO_ROI”: 0.000000000,
“Last_Period_Sellout”: 52496673.880600000,
“Sellout_Silver_Below”: 20016546.380000000,
“Sellout_Gold_Platinum”: 107800674.759999996,
“Unweighted_Sellout”: 127817221.139999996
}]
And the column structure is as below –
columns: any[] = [
{ text: ‘PartnerBudgetID’, pinned: true, dataField: ‘PartnerBudgetID’, width: 200 ,hidden:false},
{ text: ‘Partner Name’,pinned: true, dataField: ‘Partner_BU_Name’, width: 200, cellbeginedit: this.cellbeginedit },
{ text: ‘BU Name’,pinned: true, dataField: ‘BU_Name’, width: 200, cellbeginedit: this.cellbeginedit },
{ text: ‘PartnerID’, pinned: true, dataField: ‘PartnerID’, width: 200, cellbeginedit: this.cellbeginedit },
{ text: ‘1H18 MGO ROI’, dataField: ‘Last_year_MGO_ROI’, width: 100, cellbeginedit: this.cellbeginedit },
{ text: ‘Membership Type’, dataField: ‘Membership_Type’, width: 120, cellbeginedit: this.cellbeginedit },
{ text: ‘1H18 Weighted Sellout ($)’, dataField: ‘Last_Period_Sellout’, width: 120, cellbeginedit: this.cellbeginedit, cellsformat: ‘n’, hidden: true, aggregates: [‘sum’] },
{ text: ‘1H18 Sellout to Silver & Below’, dataField: ‘Sellout_Silver_Below’, width: 250, cellbeginedit: this.cellbeginedit, cellsformat: ‘n’, hidden: true, aggregates: [‘sum’] },
{ text: ‘1H18 Sellout to Platinum & Gold’, dataField: ‘Sellout_Gold_Platinum’, width: 120, cellbeginedit: this.cellbeginedit, cellsformat: ‘n’, hidden: true, aggregates: [‘sum’] },
{ text: ‘1H18 Unweighted Sellout”‘, dataField: ‘Unweighted_Sellout’, width: 150, cellbeginedit: this.cellbeginedit, cellsformat: ‘n’, hidden: true, aggregates: [‘sum’] }]

what i need is when i group by using “Partner Name” column and expand the column called “BU Name” should not be displayed and the column called “Partner Name” should display the “BU Name” column values.

Is it possible to bind datafield dynamically for a column with using grouping concept?

[MartinParticipant]

Hello smitha,

Yes, you can bind the grid’s columns dynamically in the groupschanged event handler.
However, this is not designed to be used in such a way, so the name of the grouped column also changes.
As a workaround for this you can also change the innerHTML of those elements on groupschanged, groupexpand and groupcollapse.

Here is a Demo that achieves that functionality that you need.

Best Regards,
Martin

jQWidgets Team
http://www.jqwidgets.com/

[Author]

Posts