Advanced Search

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