Design reports in the browser

Generate PDF and Excel files with ease

A platform- and browser-independent JavaScript plugin.

  • 53+

  • 58+

  • 10+

  • 14+

  • 9+

  • 46+

Intuitive Designer

ReportBro comes with a lightweight template designer that is easy to integrate into any web application. Everyone can design & edit document templates, and preview them directly in the browser. No development skills required.

Full Flexibility

Drag & drop text elements, barcodes, images and tables into your templates. Use predefined or custom patterns, make basic calculations, define conditional printing or styling behavior. Yet, there is a whole lot more you can do with ReportBro.

Beautiful Reports

Create pixel perfect documents, invoices or whatever you can think of in PDF or Excel. Design and test templates with immediate run-time feedback. Generate reports instantly with the cloud hosted ReportBro server or install your own.

Clean Data

Serving as a presentation layer ReportBro is SQL-free but takes whatever parameters you are already using, generating or calculating within your application or database. Bid farewell to discrepancies between application and report data.

Error Handling

ReportBro helps to identify and find errors during report generation, tells users when template elements are out of range, or parameters cannot be recognized. It also checks and notifies about possible issues with its configuration.

Getting started

Move the dist folder from the ReportBro Designer download into your application. To embed ReportBro in your web application you need to include the ReportBro, jQuery, Autosize, JsBarcode, Spectrum JavaScript files as well as the ReportBro and Spectrum stylesheets in the <head> of your page.
Make sure to load jQuery before ReportBro's JavaScript.

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/spectrum/1.8.0/spectrum.min.css"/>
    <link rel="stylesheet" href="dist/reportbro.css"/>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/spectrum/1.8.0/spectrum.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/autosize.js/3.0.20/autosize.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jsbarcode/3.8.0/JsBarcode.all.min.js"></script>
    <script src="dist/reportbro.js"></script>
    
Place an empty div within the <body> of a web page:

    <div id="reportbro"></div>
    
Now you are ready to go and initialize ReportBro:

    <script type="text/javascript">
       $(document).ready(function() {
          $("#reportbro").reportBro({});
       });
    </script>