X-Git-Url: http://git.roojs.org/?a=blobdiff_plain;f=Roo%2FTemplate.js;h=f117c9aa6d6429a9a686bee198e80758b448ceda;hb=HEAD;hp=12252cd19b54f538236fbcf5143d0600baf905c2;hpb=bb534654580edf2a1cb7d8b0aa24c1cdde064779;p=roojs1 diff --git a/Roo/Template.js b/Roo/Template.js index 12252cd19b..f117c9aa6d 100644 --- a/Roo/Template.js +++ b/Roo/Template.js @@ -15,36 +15,75 @@ * For a list of available format functions, see {@link Roo.util.Format}.
* Usage:

-var t = new Roo.Template(
-    '<div name="{id}">',
-        '<span class="{cls}">{name:trim} {value:ellipsis(10)}</span>',
-    '</div>'
-);
+var t = new Roo.Template({
+    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 {String/Array} html The HTML fragment or an array of fragments to join("") or multiple arguments to join("") +* @param {Object} cfg - Configuration object. */ -Roo.Template = function(html){ - if(html instanceof Array){ - html = html.join(""); +Roo.Template = function(cfg){ + // BC! + if(cfg instanceof Array){ + cfg = cfg.join(""); }else if(arguments.length > 1){ - html = Array.prototype.join.call(arguments, ""); + cfg = Array.prototype.join.call(arguments, ""); + } + + + if (typeof(cfg) == 'object') { + Roo.apply(this,cfg) + } else { + // bc + this.html = cfg; + } + if (this.url) { + this.load(); } - /**@private*/ - this.html = html; }; 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); } @@ -76,11 +115,46 @@ Roo.Template.prototype = { }; return this.html.replace(this.re, fn); } catch (e) { - console && console.log && console.log(e.toString()); + Roo.log(e); + throw e; } - return ''; + }, + 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 @@ -89,7 +163,7 @@ Roo.Template.prototype = { */ set : function(html, compile){ this.html = html; - this.compiled = null; + this.compiled = false; if(compile){ this.compile(); }