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:

- Autocompleter
- InPlaceEdit
- UneditableField

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.