ZPT-JS reference - Configuration - command

Syntax

command ::= 'preload' | 'fullRender' | 'partialRender'
                

Description

Defines the action to run. The default is fullRender. Possible values are:

Examples

An example of fullRender:

"use strict";

var zpt = require( 'zpt' );

var dictionary = {
    ...
};

// Parse template
zpt.run({
    root: document.body,
    dictionary: dictionary,
    command: 'fullRender'
});
                

This is exactly equivalent to the next example (without setting command, fullRender is the default command):

"use strict";

var zpt = require( 'zpt' );

var dictionary = {
    ...
};

// Parse template
zpt.run({
    root: document.body,
    dictionary: dictionary
});
                

Sometimes we need to render some DOM elements several times, but not the whole root element. This can be done this way:

"use strict";

var zpt = require( 'zpt' );

var dictionary = {
    ...
};

// First execution: render the body
zpt.run({
    root: document.body,
    dictionary: dictionary
});

[ your code here ]

// Second execution: render only some elements
zpt.run({
    command: 'partialRender',
    target: [ 
        document.getElementById( 'id1' ), 
        document.getElementById( 'id2' )
    ]
});
                

If we don't use external macros ZPT-JS executes synchronously: no external file needs to be loaded. But if we use at least one external macro ZPT-JS needs to load one or more external files using HTTP. This makes ZPT-JS code executes asynchronously. Keep in mind this! To deal with this take a look at:

"use strict";

var zpt = require( 'zpt' );

var dictionary = {
    ...
};

zpt.run({
    command: 'preload',
    root: document.body,
    dictionary: dictionary,
    declaredRemotePageUrls: [ 'externalMacros-definitions1.html', 'externalMacros-definitions2.html' ],
    callback: function(){
        zpt.run();
        [ your code here ]
    }
});
    

First invokation of zpt.run preload externalMacros-definitions1.html and externalMacros-definitions2.html. The second one (inside the callback) renders the HTML after preloading.