Return to Snippet

Revision: 33094
at October 6, 2010 03:20 by wildpeaks


Updated Code
/**
 * Method 1: Static template, using a SCRIPT tag.
 */

//HTML:
<script id="MyStaticTemplate" type="text/x-jquery-tmpl"> 
 <div>Hello ${hello}</div>
</script>

//Javascript:
var MyData = {hello: "world"};
$("#MyStaticTemplate").tmpl(MyData).appendTo("#contents");



/**
 * Method 2: Dynamic, from a string (which could be stored in an external
 * file or even in a database]
 */
var MyData = {hello: "world"};
$.template("MyInlineTemplate", "<div>Hello ${hello}</div>");
$.tmpl("MyInlineTemplate", MyData).appendTo("#contents");



/**
 * Note that static templates cannot be called using the dynamic method,
 * therefore this would not work:
 */
$.tmpl("MyStaticTemplate", MyData).appendTo("#contents");

Revision: 33093
at October 6, 2010 03:11 by wildpeaks


Initial Code
/**
 * Method 1: Static template, using a SCRIPT tag.
 */

HTML:
<script id="MyStaticTemplate" type="text/x-jquery-tmpl"> 
 <div>Hello ${hello}</div>
</script>

Javascript:
var MyData = {hello: "world"};
$("#MyStaticTemplate").tmpl(MyData).appendTo("#contents");



/**
 * Method 2: Dynamic, from a string (which could be stored in an external
 * file or even in a database]
 */
var MyData = {hello: "world"};
$.template("MyInlineTemplate", "<div>Hello ${hello}</div>");
$.tmpl("MyInlineTemplate", MyData).appendTo("#contents");



/**
 * Note that static templates cannot be called using the dynamic method,
 * therefore this would not work:
 */
$.tmpl("MyStaticTemplate", MyData).appendTo("#contents");

Initial URL
http://www.wildpeaks.com

Initial Description
**Important: this snipplet has moved to Github.**

 - [Method 1: Static template via a SCRIPT tag, using Jquery Templates](https://gist.github.com/1972787)

 - [Method 2: Dynamic template from an arbitrary string, using Jquery Templates](https://gist.github.com/1972811)


----

Both methods work even without the *plus* extension of the [Templates plugin](http://github.com/nje/jquery-tmpl)

Initial Title
jQuery Templates: Two ways to define a template

Initial Tags
plugin, jquery

Initial Language
jQuery