Ngx-datatable: SummaryRow applies even when there is no SummaryFunc

[cassianomon]

I'm submitting a ... (check one with "x")

[x] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, post on Stackoverflow or Gitter

Current behavior

<ngx-datatable
    class="bootstrap"
    [summaryRow]="enableSummary"
    [summaryPosition]="summaryPosition"
    [columnMode]="'force'"
    [headerHeight]="40"
    [rowHeight]="'auto'"
    [rows]="rows">
    <ngx-datatable-column prop="name" name="Nome"></ngx-datatable-column>
    <ngx-datatable-column 
        prop="valorDocumento" 
        [summaryFunc]="summValorDocumento">
    </ngx-datatable-column>
</ngx-datatable>

Results in a footer summary row with:
[ name1name2name3 | 1000 ]

Expected behavior
Since I am not giving a summaryFunc for the first column prop="name", I expected a footer summary row like this:
[ empty here | 1000 ]

Reproduction of the problem

Please tell us about your environment:
OS: Windows 10
IDE: Visual Studio Code
package manager: Yarn and NPM

• Table version: 11.3.0 and 12.0.0

• Angular version: 6.0.0 and 4.1.0

• Browser:
  Chrome

• Language: [all | TypeScript X.X | ES6/7 | ES5]
  TypeScript 2.4.2 and 2.7.2

[cassianomon]

@amcdnl @SirWojtek anything you guys can help me with?

[SirWojtek]

Hello @cassianomon, thank you for creating the issue. I'll try to look at your problem deeply in this week, I need to gather all possible solutions.
As a workaround, I suggest you to "trick" template passing an empty function:

HTML

<ngx-datatable-column prop="name" name="Nome" [summaryFunc]="noop"></ngx-datatable-column>

TS

noop() { return null; } 
// or
noop() {}

[SirWojtek]

The situation is a bit complicated. From one side you may want to automatically apply a simple summary function without additional configuration (which is current behaviour) but from the other side, you may want to specify precisely a summary function for a couple of columns and override the default behaviour.
To have both working, my proposal is to introduce additional datatable input called defaultSummaryFunction so you can specify a fallback function if you don't provide it for columns.
In your particular case, you'll need to set defaultSummaryFunction to noop. What do you think?

[cassianomon]

summaryFunc could be the default, so you could create a customSummaryFunc, but IMO setting noop is not a good practice, the summary row could set the column to null if there is no summaryFunc set for that column.

[SirWojtek]

Let's tackle the problem from another side. Maybe I can adjust the implementation of the default summary function to works only for numbers? Because in most cases you don't want to make the sum of string-based columns. This will solve your case and bring more reasonable behavior for other cases.

[SirWojtek]

Ok, what I've done:

1. You can provide null as a summaryFunc - more elegant than noop function.
2. Default summary function will no longer accept string based columns.

What does it mean for your case?

<ngx-datatable
    class="bootstrap"
    [summaryRow]="enableSummary"
    [summaryPosition]="summaryPosition"
    [columnMode]="'force'"
    [headerHeight]="40"
    [rowHeight]="'auto'"
    [rows]="rows">
    <ngx-datatable-column
        prop="name"
        name="Nome"
        [summaryFunc]="null">
    </ngx-datatable-column>
    <ngx-datatable-column 
        prop="valorDocumento" 
        [summaryFunc]="summValorDocumento">
    </ngx-datatable-column>
</ngx-datatable>

will work. Without null as an argument to summaryFunc a datatable will complain about trying to use the default summary function for unsupported type of cells.

[cassianomon]

Tell me when I will be able to test this

[SirWojtek]

@cassianomon After I perform a couple of example usages of a summary row I must admit putting null on every non-number row can be a frustrating experience so I've decided to remove the throw statement from the default summary function.

PR containing the fix for this issue is ready to be reviewed. If you like to test it, you can download my branch and build it on your own.

[vikas-rb15]

HTML:

<ngx-datatable-column *ngFor="let col of columns" name="{{col.name}}" prop="{{col.prop}}" [sortable]="false" [cellClass]="getCellClass" [summaryFunc]="col.prop == 'column1' || col.prop == 'column2' || col.prop == 'column3' ?summaryForAmount:summaryNull">
</ngx-datatable-column>

ts Code:

summaryForAmount(cells: any): string {
        let count: number = 0;
        let re = /\,/gi;

        cells.filter((cell) => { 
            if (cell != null && cell != undefined) {

                if (!(cell.indexOf('-') > -1 || cell.indexOf('(') > -1)) {
                    count = count + +cell.replace(re, '');
                }
                else if (cell.indexOf('-') > -1) {
                    count = count + 0;
                }
                else if (cell.indexOf('(') > -1) {
                    let number = cell.replace('(', '').replace(')', '');
                    count = count - +number.replace(re, '');
                }
            }
        });

        return count.toString().indexOf('-') > -1 ? count.toLocaleString('en').replace('-', '(').concat(')') : count.toLocaleString("en");
    }

private summaryNull(cells: any): null {
        return null;
    }

Let me know if you have any doubt

[SirWojtek]

@cassianomon Can we close this issue?