JayData.org

Handlebars helpers and model driven commanding in JayData

Author: Peter Aron Zentai December 28th, 2012


The JayData Handlebars module adds a number of Handlebars helpers that you can use in your templates to display and work with data. Read this post for the details on how to use Handlebars templates in JayData.

The {{renderEntity}} helper

This helper invokes the JayData entity rendering engine and is a conduit to invoke item.render() from within a template.

The following example creates a Todo type, adds two new items to the default item store, displays them with the template “newItemsTemplate”, then gets all items from the store and displays then with the “allItemsTemplate”. In both cases the {{renderEntity}} helper uses the default type based template (unless a template name or code is specified) to display individual items.

Code:

Markup:

{{renderEntity }}

Result:

image

Using renderEntity with named templates

Code:

Markup:

The {{entityCommand}} helper

The {{entityCommand}} helper provides for simple model driven UI events. Annotate any elements with the {{entityCommand}} helper passing a helper function name to get a callback with the actual data when the user clicks the given element. Callback method names must follow the ‘command’ + ‘Typename’ logic.

The following code implements a simple master detail scenario. First all Todo items are displayed. When the user clicks on a Todo a detailed view of that Todo item is displayed.

Markup: