19.5.2014
Every application should provide some useful outputs to its users - one of the typically required output is a print report. Deko the CRM is written in C++. It is beautiful and powerful language but it has some disadvantages to use it for report creation:
How to get from this situation? For a long years I'm used to use Javascript for various extensions of my C++ applications. It is easy to add Javascript interpreter to C++ application but for long time I did not realized the advantages of Javascript for reports creation.
Reports have to be created simply by an average developer. There are huge amount of developers that know how to use HTML and many of them know to use the Javascript, too. So the Deko has new document type, report - build-in web browser and some methods for database queries.
Print report is created as a simple HTML page with some parts in Javascript. HTML is used as a template - the report layout and appearance is described in HTML and CSS, and Javascript adds some user data from database to the report. Masochist can use plain Javascript to modify HTML but there are many of libraries to greatly simplify the work - we choosed the jQuery library.
What advantages brings the HTML and Javascript to report developing?
Database can be accessed using two different methods:
The deko scheme can be used to access images, libraries and css files:
<img src="deko:///id-of-document/name-of-attachment.svg" alt="logo">
The C++ part of Deko is visible through Javascript object deko. Database can be accessed directly using the object:
var document = deko.get('id-of-requested-document');
With jQuery library is the combination very powerful. Complete report can look like this:
<html> <head> <script type="text/javascript" src="deko:///report-resources/jquery-2.1.0.min.js"></script> </head> <body> <h1>List of companies</h1> <table class="report"> <thead> <tr><th>Name</th><th>Web</th><th>City</th></tr> </thead> <tbody> </tbody> <tfoot> <tr><th colspan="4"> <th></tr> </tfoot> </table> <!-- ******* Here the HTML ends and javascript begins ******* --> <script type="text/javascript"> $(document).ready(function(){ deko.begin(); var id = deko.id(); var doc = deko.get(id); var parent = deko.linksToMe(id); var parentid = parent.rows[0].value.docid; var parentlinks = deko.linksFromMe(parentid); for (var i=0; i<parentlinks.rows.length; i++) { var xtype = parentlinks.rows[i].value.doctype; var xid = parentlinks.rows[i].value.docid; if (xtype == 'company') { var xdoc = deko.get(xid); var city = (xdoc.city == undefined) ? '' : xdoc.city; var wwww = (xdoc.www == undefined) ? '' : xdoc.www; $("table.report tbody").append( '<tr>' + '<td>' + xdoc.name + '</td>' + '<td>' + wwww + '</td>' + '<td>' + city + '</td>' + '</tr>\n' ); } } }); </script> </body> </html>
http://dokumentace.hobrasoft.cz/index.php/Tisková_sestava - Deko documentation, reports
http://www.hobrasoft.cz/en/deko/reports/ - reports to download
http://www.w3schools.com/js/default.asp - Javascript tutorial
http://www.w3schools.com/jQuery/ - jQuery tutorial
http://jquery.com/download/ - jQuery, home page