summable - paulmaclean/datatables.webcomponent GitHub Wiki

summable

Type: SummableOpts

Default:

{ 
    enabled: true,
    colIndexes: [],
    formatter: (val, index) => {
       return new Intl.NumberFormat('en-UD').format(val)
    }
}

The summable property sets the options for summing columns. The colIndexes array indicated which columns are to be summed.

example

render() {
    return html`
        <example-data-table .summable="${ {colIndexes: [5]} }"></example-data-table>
    `
}

example with different formatters

 render() {
        return html`
            <example-data-table 
                .data="${sampleData.default}"
                .summable="${ {
                                colIndexes: [1, 2], 
                                formatter: (val, index) => {
                                     if(index == 1) {
                                         return currencyFormatter.format(val)}} 
                                     } 
                                     return new Intl.NumberFormat('en-UD').format(val)
                               }
                            }"
                >
            </example-data-table>`
    }

...
const currencyFormatter = new Intl.NumberFormat('en-US', {
    style: 'currency',
    currency: 'USD',
    minimumFractionDigits: 2
});