inputEx Documentation Back to homepage

inputEx Documentation > Visualization 0.2.2

Visualization/Templating in inputEx


Introduction

The use of a template engine in inputEx first appeared for the Autocompleter, InPlaceEdit and Uneditable fields.
It has also proven very useful in projects that use inputEx.

The library itself doesn't include a template engine, but provides a standard way to use different engines and define your templates within field configurations. It is also very simple to add interfaces to other template engines.

Rendering

The fields should use the inputEx.renderVisu method to use templates:


renderVisu

static <HTMLElement || String> renderVisu(visuOptions,data,parentEl)
Render 'data' using a visualization function described by 'visuOptions'
Parameters:
    visuOptions <Object>  - The visu parameters {visuType: 'myType', ...args...}
    data <Object>  - The input data to send to the template
    parentEl <HTMLElement || String>  - optional Set the result as content of parentEl
Returns:
    <HTMLElement || String> Either the inserted HTMLElement or the String set to parentEl.innerHTML

Templating methods are stored in the inputEx.visus object. Methods can return either a HTMLElement or a String, since inputEx.renderVisu handle both.

inputEx.visus contains 3 default methods (you can add your own) :

  • dump: uses YAHOO.lang.dump to generate a string from any object
  • trimpath: use Trimpath JST template engine (requires lib/trimpath-template-v.v.v.js)
  • func: any function, useful for building interactive templates, cannot be described in json

inputEx.Visus methods are functions that take 2 parameters :

  • options: template object passed to Object containing the "visuType" property and template specific parameters
  • data: the data sent to the template

Examples

Check the following examples to see template usage:


Copyright (c) 2007-2009 Eric Abouaf. All rights reserved.
Generated by JsDoc Toolkit 2.0.0 on Wed, 04 Mar 2009 15:41:32 GMT using neyricjslibs-template.