jsrender templating engine

Basics

jsreport jsrender engine uses jsrender library and therefore is fully compatible with it. This page will contain only some examples. Full documentation is located at http://www.jsviews.com/

Data binding

You can use values from report input data using {{:...}} tags.

Assuming following input data object

{
    "title": "Hello world"
}

you can use {{:title}} to print Hello world

<h1>{{:title}}</h1>

Conditions

Assuming folowing input object:

{
    "age" : 18,
    "name" : "Jan Blaha"
}

Then you can use age in condition in a following way:

{{if age >= 18}}
    <h1>{{:name}} is elligible to drink.</h1>
{{else}}
    <h1>{{:name}} is not elligible to drink.</h1>
{{/if}}

Loops

Assuming following input data object

{
    "comments": [{"title": "New job", "body": "js developers wanted at... " }]
}

You can simply iterate over comments using for

{{for comments}}
  <h2>{{:title}}</h2>
  <div>{{:body}}</div>
{{/for}}

Helpers

jsreport report template contains content filed with javascript templating engines tags and helpers field where you can place some javascript functions and then use them.

For example you want to have an upper case helper function. You can register a global function inside a helpers field with the following code:

function toUpperCase(str) {
    return str.toUpperCase();
}

And then you can call function in jsrender using:

say hello world loudly: {{:~toUpperCase("hello world")}}

Sub templates

jsreport also supports jsrender sub-templates feature. That can be handy when you want to iterate over a collection of data and print a specific template for each of the item.

For this purpose you can define an item sub template inside a content field using following syntax:

<script id="itemTemplate" type="text/x-jsrender">
    {{:#data}}
</script>

Then you can say to jsrender to use this sub template with following:

{{for languages tmpl="itemTemplate"/}}

It's a good practice to use jsrender sub templates together with jsreport child templates and move sub templates into dedicated report templates. This will allow you to separate big template into multiple templates and keep things clear. Note that you should set jsreport child template to None engine and html recipe for this case.


jsreport version