X-Git-Url: http://git.roojs.org/?a=blobdiff_plain;f=Roo%2FTemplate.js;h=f117c9aa6d6429a9a686bee198e80758b448ceda;hb=refs%2Fheads%2Fwip_leon_T7094_logo_image_upload_in_boilerplate;hp=7084170e83d2fa241ab735d6c9fb49e453d06211;hpb=33add3b9c408f85845b4ec1bb29e359a1fd25251;p=roojs1 diff --git a/Roo/Template.js b/Roo/Template.js index 7084170e83..f117c9aa6d 100644 --- a/Roo/Template.js +++ b/Roo/Template.js @@ -16,17 +16,20 @@ * Usage:

 var t = new Roo.Template({
-    * html : 
-    '<div name="{id}">',
-        '<span class="{cls}">{name:trim} {value:ellipsis(10)}</span>',
-    '</div>'
-);
+    html :  '<div name="{id}">' + 
+        '<span class="{cls}">{name:trim} {someval:this.myformat}{value:ellipsis(10)}</span>' +
+        '</div>',
+    myformat: function (value, allValues) {
+        return 'XX' + value;
+    }
+});
 t.append('some-element', {id: 'myid', cls: 'myclass', name: 'foo', value: 'bar'});
 
-* For more information see this blog post with examples: DomHelper - Create Elements using DOM, HTML fragments and Templates. +* For more information see this blog post with examples: +* DomHelper + - Create Elements using DOM, HTML fragments and Templates. * @constructor * @param {Object} cfg - Configuration object. -* @param {String/Array} html */ Roo.Template = function(cfg){ // BC! @@ -43,23 +46,44 @@ Roo.Template = function(cfg){ // bc this.html = cfg; } - + if (this.url) { + this.load(); + } }; Roo.Template.prototype = { + /** + * @cfg {Function} onLoad Called after the template has been loaded and complied (usually from a remove source) + */ + onLoad : false, + + + /** + * @cfg {String} url The Url to load the template from. beware if you are loading from a url, the data may not be ready if you use it instantly.. + * it should be fixed so that template is observable... + */ + url : false, /** * @cfg {String} html The HTML fragment or an array of fragments to join("") or multiple arguments to join("") */ html : '', + + + compiled : false, + loaded : false, /** * Returns an HTML fragment of this template with the specified values applied. * @param {Object} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'}) * @return {String} The HTML fragment */ + + + applyTemplate : function(values){ + //Roo.log(["applyTemplate", values]); try { - + if(this.compiled){ return this.compiled(values); } @@ -97,6 +121,40 @@ Roo.Template.prototype = { }, + loading : false, + + load : function () + { + + if (this.loading) { + return; + } + var _t = this; + + this.loading = true; + this.compiled = false; + + var cx = new Roo.data.Connection(); + cx.request({ + url : this.url, + method : 'GET', + success : function (response) { + _t.loading = false; + _t.url = false; + + _t.set(response.responseText,true); + _t.loaded = true; + if (_t.onLoad) { + _t.onLoad(); + } + }, + failure : function(response) { + Roo.log("Template failed to load from " + _t.url); + _t.loading = false; + } + }); + }, + /** * Sets the HTML used as the template and optionally compiles it. * @param {String} html @@ -105,7 +163,7 @@ Roo.Template.prototype = { */ set : function(html, compile){ this.html = html; - this.compiled = null; + this.compiled = false; if(compile){ this.compile(); }