Skip to content

Latest commit

 

History

History
45 lines (33 loc) · 1.45 KB

README.md

File metadata and controls

45 lines (33 loc) · 1.45 KB

A jQuery templating plugin - created for demonstration purposes.


// Render one LI, filled with data, then append it into the UL

$.tmpl( "<li>${firstName}</li>", dataObject )
	.appendTo( "ul" );

<!-- Declare a template as a script block of type "text/html" -->

<script id="sometmpl" type="text/html">
	<li>${firstName}</li>
</script>

// Render the declared template as one LI appended to the target UL

$( "#sometmpl" )
	.tmpl( dataObject )
	.appendTo( "ul" );

// Render the declared template as multiple LIs appended to the target UL
// Provide a click event accessing the data

$( "#sometmpl" )
	.tmpl( arrayOfDataObjects )
	.appendTo( "ul" )
	.click( function() {
		alert( $.tmpl(this).data.firstName );
	});

// Store a string as a compiled template for later use
$.templates( "myTmpl", "<span>${firstName}</span>" );

// Render stored template and insert after target. 
$.tmpl( "myTmpl", dataObject )
	.insertAfter( "#target" );

A demo page using this plugin can be found here: http://infinity88.com/jquery-tmpl/movies/movies.htm