jQuery.tmp Level 1 - Static Html

Load a Template from static Html Javascript String.

Html Source

<div class="s1"></div> 
<div class="s1"></div>		

Javascript Source

$('.s1').tmp('<span>Template from static Html...</span>');

---

Load a Template from static Html Javascript String with context data.

Html Source

		<div class="s2"></div> 
		<div class="s2"></div> 

Javascript Source

$('.s2').tmp({
	'html':'<span>Indexed div number <%=index%>...</span>',
	'contextData' : {
		'index': 1
	}
});

---

Load a Template from jQuery Object.

Html Source

		<div class="s3"></div> 
		<div class="s3"></div> 

Javascript Source

var _newSpan;
 
_newSpan = $('<span/>').html('From jQuery Object.'); 
$('.s3').tmp( _newSpan );
 

---

Load a Template from jQuery Object with context data.

Html Source

		<div class="s4"></div> 
		<div class="s4"></div> 

Javascript Source

_newSpan = $('<span/>').html('Indexed with number <%=index++%> From jQuery Object.'); 
$('.s4').tmp({
	html:_newSpan,
	contextData:{index:0}
});			

---

jQuery.tmp Level 2 - External Html Templates with Javascript Event Bindings

Load Templates from external Template.

Html Source

		<div class="s6"></div> 
		<div class="s6"></div> 

sample_hover_click.htm

<ol>
	<span id="state">Click a listitem please.</span>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
</ol>

Javascript Source

$('.s6').tmp({url:'/tmp/sample_hover_click.htm'});

---

Load a Template from external Template Html File with context data.

Html Source

		<div class="s5"></div> 
		<div class="s5"></div> 

/tmp/sample_simple_list.htm

<ul id="test">
	<li id="state"><strong><i>Name : <%=text%>.</i></strong></li>
	<li id="item">Value of Setting Id <%=id%> is <%=value%></li>
</ul>

Javascript Source

var data = [{id:10,text:'CacheHits',value:'9337'},{id:11,text:'CacheReadIndInt',value:'259'},{id:12,text:'CacheReadIndLeaf',value:'1057'},{id:15,text:'CacheRead',value:'9421'}];

$(data).each(function(i,n){
	var _item = $('<div/>').tmp({url:'/tmp/sample_simple_list.htm', contextData:n}).appendTo($('.s5'));
});

Download - SVN Repository