jQBinder: jQuery plug-in


This is my attempt to create client-side template engine, jQBinder, as a jQuery plug-in, inspired by "Enforcing Strict Model-View Separation in Template Engines" (Terence Parr).
It allows developers to embed view-template within HTML, and data-bind it to a JSON data asynchronously downloaded from the server.
The syntax is very simple. You just need to put something like this in HTML (HTML snippet between outer <div> is the template):
<div id="#target">
<img src='$(.profile_image_url)' />
<div>$(.text)</div>
</div>
Then, simply call
$("#stage").dataBindTo( { urlToJSONP, options } );
It will load a json data from the specified URL (which must be an array), then generate HTML snippet for each row of data using the template above - replacing all $(.propertyName) with the specified property of each row data.
I have tested it on Safari 4.0, Chrome 4.0, Firefox 3.5, Opera 9.0 and IE 7/8 so far.
It allows developers to embed view-template within HTML, and data-bind it to a JSON data asynchronously downloaded from the server.
The syntax is very simple. You just need to put something like this in HTML (HTML snippet between outer <div> is the template):
<div id="#target">
<img src='$(.profile_image_url)' />
<div>$(.text)</div>
</div>
Then, simply call
$("#stage").dataBindTo( { urlToJSONP, options } );
It will load a json data from the specified URL (which must be an array), then generate HTML snippet for each row of data using the template above - replacing all $(.propertyName) with the specified property of each row data.
I have tested it on Safari 4.0, Chrome 4.0, Firefox 3.5, Opera 9.0 and IE 7/8 so far.
satoshi (56)
0 Comment
Leave a commentLeave a comment