Dynamic templating for bootstrap.
JavaScript HTML
Switch branches/tags
Nothing to show
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
demo.html
gluon.js
jquery-2.0.3.min.js
license.txt
package.json
readme.md

readme.md

gluon.js

Work in progress. Please feel free to contribute.

Dynamic templating for bootstrap.

Examples

If you have a JavaScript object in the browser like this:

var demo = { 
	firstName : "Richard", 
	last_name : "Astbury", 
	checkBoxTrue : true, 
	age:36 };

You can create an HTML form with the edit function:

$("#edit").html(Gluon.edit(demo));

Which looks like this:


Edit


To convert the form back into an object, use the toJS function:

var demo2 = Gluon.toJS();

You can create an HTML form to just display the values with the view function:

$("#view").html(Gluon.view(demo));

Which looks like this:


View


You can create a table of objects like this:

$("#view").html(Gluon.table([demo,demo,demo]));

Table


If you wan to enable multiple forms on the page, you can supply a sessionId:

$("#edit").html(Gluon.edit(demo, {sessionId: "123"}));

// the user edits the page

var demo2 = Gluon.toJS("123");

Options

An options object can be passed in as a second argument, with the following fields:

  • ignoreList an array of strings, containing the field names to ignore.
  • sessionId a value to append to the class of the input elements, allowing you to use jQuery (or simliar) to

License

MIT