ParamQuery grid support forum

General Category => ParamQuery Pro Evaluation Support => Topic started by: akraines on July 15, 2019, 11:46:36 pm

Title: How to style Summary cells for aggregated columns
Post by: akraines on July 15, 2019, 11:46:36 pm

Hi,

I'm evaluating the pqGrid, and it has many of the required features for our use case. However, I don't see of a way apply a css class to the generated summary.
 I managed to render this in the cell - but it came out as text: <span class="pq-agg-label">Total:</span> 736789.28

Does pqGrid support this?

Thanks

Title: Re: How to style Summary cells for aggregated columns
Post by: akraines on July 15, 2019, 11:55:48 pm

I attempted to use the folowing approach:

Code: [Select]

const agg = pq.aggregate;
            //define custom aggregate "all" and now it can be used in any column.
            agg.total = function(arr, col){
                console.log(arr,col);
                return `<span class="pq-agg-label">Total:</span> ${format( agg.sum(arr, col) )}`;
            };


Title: Re: How to style Summary cells for aggregated columns
Post by: paramvir on July 16, 2019, 05:39:15 pm

custom aggregates are used to define custom aggregate algorithms and not used for presentation i.e., to inject html, classes, styles, etc

column.render is used to add classes, styles and inject html.

https://paramquery.com/pro/api#option-column-render

Examples:

https://paramquery.com/pro/demos/render_cells

https://paramquery.com/pro/demos/condition_style

https://paramquery.com/pro/demos/summary_json

Title: Re: How to style Summary cells for aggregated columns
Post by: akraines on July 18, 2019, 12:04:02 am

Thanks you very much for your helpful reply - it is enough for me to work with.

Is there a way to identify if the row is a "aggregate" row/cell? Or do I need to manually make my own heurustic like checking if the rowData starts with "Sum" then apply the styling?

Thanks

Title: Re: How to style Summary cells for aggregated columns
Post by: paramvir on July 18, 2019, 01:39:05 pm

summary row has summaryRow property in rowData.

ui.rowData.summaryRow

Please also have a look at rowInit for row related styles, classes, etc.

https://paramquery.com/pro/api#option-rowInit

Title: Re: How to style Summary cells for aggregated columns
Post by: akraines on July 18, 2019, 06:57:13 pm

I'm referring to a aggregate "cell" - not the summary row. The only way I have so far noticed to check fo it is to check if it has a "children" key (and is missing the keys from colData).
Is this an accurate way to detect this? Is there a better way?

Title: Re: How to style Summary cells for aggregated columns
Post by: akraines on July 18, 2019, 08:39:46 pm

(Checking of "children" key worked for me. Thanks. - If there is a better way, please let me know.)

Title: Re: How to style Summary cells for aggregated columns
Post by: akraines on July 24, 2019, 11:35:49 pm

Followup question:
This doesn't work for Grand Summary row.
How do I:
1) Customize the render function of the GrandSummary row
2) Show the Grand summary row at the top
3) If there is only one lineitem in a group, dont show summary row for that group.

Title: Re: How to style Summary cells for aggregated columns
Post by: paramvir on July 26, 2019, 10:19:42 am

Please check groupModel API: https://paramquery.com/pro/api#option-groupModel

Summary rows can be identified by pq_gsummary and grand summary rows by pq_grandsummary