You are here: Foswiki>System Web>JQueryPlugin>JQueryTmpl (01 Jun 2017, Attach


jQuery templates contain markup with binding expressions ('Template tags'). Templates are applied to data objects or arrays, and rendered into the HTML DOM


No such plugin tmpl

This is a template stored in a script section of type text/x-jquery-tmpl. This is going to be used by jquery.tmpl in a loop over all data provided and render a list item for each by inserting the data from the array into this template and append it to the movie list

<script id="movieTemplate" type="text/x-jquery-tmpl"> 
  <b>${Name}</b> (${ReleaseYear})

This is example stores data locally in a javascript array. You may also fetch this data using remote data. See the second example.

jQuery(function($) {
  var movies = [
    { Name: "The Red Violin", ReleaseYear: "1998" },
    { Name: "Eyes Wide Shut", ReleaseYear: "1999" },
    { Name: "The Inheritance", ReleaseYear: "1976" }

  $("#movieTemplate").tmpl(movies).appendTo( "#movieList");

The result will be appended to the movieList element:

<ul id="movieList"></ul> 

    Topic revision: r3 - 01 Jun 2017,
    This site is powered by FoswikiCopyright © by the contributing authors. All material on this site is the property of the contributing authors.
    Ideas, requests, problems regarding Foswiki? Send feedback