Sample data

The JSON the report is rendered with. Expressions in the template such as invoice.number or row.amount resolve against it; a detail band's dataSource names one of its arrays.

Render this template

The request your server sends to ERD Report Cloud for the open design and its data. The API key is a server secret; never call the render API from a browser.

Locale template default Time zone template default Per-request overrides of the template's defaults; leave empty to keep them. The template's own defaults and assets are edited in the inspector: click the empty workspace outside the page.

About this demo

This page embeds the ERD Report Designer exactly as your application would: one script, one stylesheet, a root element with a height, and ErdReportDesigner.mountReportDesigner(). Read its source alongside README.md in the archive. Open the browser's developer tools: every event the designer raises is logged to the console as you work, and window.demo.handle() is the handle your application would hold.

The Examples menu opens nine designs (invoice, quotation, purchase order, statement, delivery note, shipping label, price list, timesheet, sales summary), each with sample data, from demo/examples/. File → Save JSON downloads exactly what the render API accepts, and Report → Render request shows the call your server makes with it.

Every example defines the house-* styles it uses in its own styleSheet and applies them by styleName, with formatting rules for negative amounts, overdue payments and the like. With a designer build that offers it, View → House style lays a sample house style over those defaults, as your application would with its own, and the render request then carries it as styleSheet.

This page is the report designer: it was mounted with composition: { mode: 'report' }, so its palette carries bands and it refuses a label template rather than opening one it could not honestly edit. labels.html beside it is the same page mounted the other way.