This class caches templates in the DOM, and provides convenient methods to manage them.
Mikkel Bergmann, http://www.pointful.com
| pax. | This class caches templates in the DOM, and provides convenient methods to manage them. |
| Functions | |
| pax. | Retreives a template from a given URL, and caches it. |
| pax. | Retreives data from a given URL. |
| pax. | Retreives a template from a given URL, caches it, and then renders it. |
pax.cache.template.loadTemplate = function( templateUrl, postObj, callBack )
Retreives a template from a given URL, and caches it. When it is done, it runs the specified call back method
| templateUrl | The URL to load a template from |
| postObj | The POST data object, if null or false, we use GET instead. Use {} for no parameters in the POST |
| callBack | A method to run when the template has been cached. Hint: the callBack is passed back the URL, which is also the cache key. |
<div id="pax.cache.template.loadTemplate.example1"></div>
[:.
function hasLoaded( key ) {
var myData = [
{ 'firstName': 'Bill', 'lastName': 'Washman' },
{ 'firstName': 'Julia', 'lastName': 'Copalotalus' },
{ 'firstName': 'Isabella', 'lastName': 'Carnivoree' }
];
pax.template.render( pax.cache.get( key ), myData, pax.$('pax.cache.template.loadTemplate.example1') );
pax.cache.remove( key );
}
pax.cache.template.loadTemplate( '/pax/pax.cache.template.loadTemplate.example1.tpl', false, hasLoaded );
:]Loads the template into the cache, and then renders it from there, using pax.template.render.
<div id="pax.cache.template.loadTemplate.example2"></div>
[:.
function hasLoaded( key ) {
var myData = [
{ 'firstName': 'Bill', 'lastName': 'Washman' },
{ 'firstName': 'Julia', 'lastName': 'Copalotalus' },
{ 'firstName': 'Isabella', 'lastName': 'Carnivoree' }
];
pax.template.render( pax.cache.get( key ), myData, pax.$('pax.cache.template.loadTemplate.example2') );
pax.cache.remove( key );
}
pax.cache.template.loadTemplate( '/pax/pax.cache.template.loadTemplate.example1.tpl', {}, hasLoaded );
:]Loads the template into the cache, (via post with no parameters), and then renders it from there, using pax.template.render.
pax.cache.template.loadData = function( dataUrl, postObj, callBack )
Retreives data from a given URL. When it is done, it runs the specified call back method
| dataUrl | The URL to load data from |
| postObj | The POST data object, if null or false, we use GET instead. Use {} for no parameters in the POST |
| callBack | A method to run when the template has been cached. Hint: the callBack is passed back the URL, which is also the cache key. |
The data loaded is:
<div id="pax.cache.template.loadData.example1"></div>
[:.
function hasLoaded( txt ) {
pax.$('pax.cache.template.loadData.example1').innerHTML = txt;
}
pax.cache.template.loadData( '/pax/pax.cache.template.loadTemplate.example1.data', false, hasLoaded );
:]Loads data. Note that data is never cached.
pax.cache.template.loadAndRender = function( target, templateUrl, dataUrl, dataPostObj )
Retreives a template from a given URL, caches it, and then renders it.
| target | the DOM element to render the template and data into. |
| templateUrl | The URL to load a template via a GET |
| dataUrl | The URL to load data from via a GET |
| dataPostObj | If we want to use POST to retreive the data, specify a dictionary of post key -> value pairs here. If you want to use GET, omit this parameter. |
<div id="pax.cache.template.loadAndRender.example1"></div>
[:.
pax.cache.template.loadAndRender( pax.$('pax.cache.template.loadAndRender.example1'), '/pax/pax.cache.template.loadTemplate.example1.tpl', '/pax/pax.cache.template.loadTemplate.example1.data' );
:]Loads the template, then the data, and renders it into the target.
Retreives a template from a given URL, and caches it.
pax.cache.template.loadTemplate = function( templateUrl, postObj, callBack )
Retreives data from a given URL.
pax.cache.template.loadData = function( dataUrl, postObj, callBack )
Retreives a template from a given URL, caches it, and then renders it.
pax.cache.template.loadAndRender = function( target, templateUrl, dataUrl, dataPostObj )
Renders the template with given value into the target container.
pax.template.render = function( template, args )