jQuery Templates

February 22nd, 2008

Posted at 10:48am by Stan

Some conversation at work arose about templating in jQuery. The honest answer to anyone inquiring about this is that jQuery lacks any real good solution for simple macro-based templating. I was directed to Ext, which has a Template library in it that does exactly this. Subsequently, I've proposed to the UI folk a port of Ext.Template. For the most part the port is direct, the apply() and compile() methods are virtually identical to Ext.Template, though they use some jQuery functions instead of Ext.Core functions. The constructor is very different, and the designation of compiling is via a jQuery-style options object passed to the template constructor. I've tried to follow the jQuery.UI API as best as I know. I've changed the formatter usage in Ext.Template, as it depends on Ext.util.Format which isn't available in jQuery. All in all, this functionality does not seem like it's necessary so I changed it to use what I'm calling "helpers". These helpers provide the variable:method() syntax like in Ext.Template but allows the designer to customize what functions are available in a jQuery-style way.

Updated 03/12/2008: Anyhow, the code for my port and proposal is available here:
http://stanlemon.net/files/jquery.template.js

javascript, jquery, templates

Comments:

Posted on July 18, 2008 08:28am by William Ukoh
could you post sample code on how this could be used.
Posted on July 18, 2008 12:59pm by Stan
Take a look here:
http://www.stanlemon.net/projects/jquery-templates.html

You'll find working examples at the bottom of the page.
Posted on August 21, 2008 03:41am by Chris Frost
Is there a way this could be edited to include the option of easily including an .html file?

Example:

In a normal css/html layout would you be able to use something like and have that code inside that file.html placed inside the current html?

Post Comment:


Enter the code you see in the image below.