New: data table support in report builder API

As you can see in the new bank statement example, jsreports now includes support for data tables defined either in JSON or using the report builder API.  Here’s an example:

jsreports table element example

This table uses nested JSON data, applies a grouping, and then uses CSS to add the borders and bold text.  Cell formats are supplied as configuration properties.  Here’s the code:

.table(0, 1.25, 4.75, 2.5, { data: 'changeItems', hasFooter: true, 
    groupBy: 'category', fontSize: 9, hideRowWhenExpr: '!description' 
})
.column('50%', '   [description]', '', '', { 
    align: 'left', group0Header: '[category]' })
.column('25%', '[currentPeriod]', 'This Period', '[SUM(currentPeriod)]', { 
    align: 'right',
    detailStyle: {
        pattern: '#,##0.00'
    },
    group0Header: '[SUM(currentPeriod)]',
    group0HeaderStyle: {
        pattern: '#,##0.00'
    }
})
.column('25%', '[ytd]', 'Year-to-Date', '[SUM(ytd)]', { 
    align: 'right',
    detailStyle: {
        pattern: '#,##0.00'
    },
    group0Header: '[SUM(ytd)]',
    group0HeaderStyle: {
        pattern: '#,##0.00'
    }
})

We’ll be adding support for tables in the report designer soon.  For now, they’re only available through the API.

JavaScript enthusiast at jsreports – building a better reporting solution for modern web applications