X-Git-Url: http://git.roojs.org/?a=blobdiff_plain;f=Roo%2FXTemplate.js;h=a19d417fcf26199f5b783faab2436edc6161bdcb;hb=61bc45258e16a779856dd2ad0862630b489e4583;hp=dab05f569c722cd217c02efc10be734b6e936b25;hpb=60c1972eb90c8d55d4be0bd5d829ea2f19d43030;p=roojs1 diff --git a/Roo/XTemplate.js b/Roo/XTemplate.js index dab05f569c..a19d417fcf 100644 --- a/Roo/XTemplate.js +++ b/Roo/XTemplate.js @@ -15,7 +15,7 @@ * @extends Roo.Template * Provides a template that can have nested templates for loops or conditionals. The syntax is: 

-var t = new Roo.MasterTemplate(
+var t = new Roo.XTemplate(
 	'<select name="{name}">',
 		'<tpl for="options"><option value="{value:trim}">{text:ellipsis(10)}</option></tpl>',
 	'</select>'
@@ -27,20 +27,25 @@ var t = new Roo.MasterTemplate(
  * Supported features:
  *
  *  Tags:
- *    {a_variable} - output encoded.
- *    {a_variable.format:("Y-m-d")} - call a method on the variable
- *    {a_variable:raw} - unencoded output
- *    {a_variable:toFixed(1,2)} - Roo.util.Format."toFixed"
- *    {a_variable:this.method_on_template(...)} - call a method on the template object.
- *  
- *  Tpl:
- *      <tpl for="a_variable or condition.."></tpl>
- *      <tpl if="a_variable or condition"></tpl>
- *      <tpl exec="some javascript"></tpl>
- *
- *      <tpl for="."></tpl> - just iterate the property..
- *      <tpl for=".."></tpl> - iterates with the parent (probably the template) 
- *      
+
+

+      {a_variable} - output encoded.
+      {a_variable.format:("Y-m-d")} - call a method on the variable
+      {a_variable:raw} - unencoded output
+      {a_variable:toFixed(1,2)} - Roo.util.Format."toFixed"
+      {a_variable:this.method_on_template(...)} - call a method on the template object.
+ 
+

+ *  The tpl tag:
+

+        <tpl for="a_variable or condition.."></tpl>
+        <tpl if="a_variable or condition"></tpl>
+        <tpl exec="some javascript"></tpl>
+        <tpl name="named_template"></tpl> (experimental)
+  
+        <tpl for="."></tpl> - just iterate the property..
+        <tpl for=".."></tpl> - iterates with the parent (probably the template) 
+

  *      
  */
 Roo.XTemplate = function()
@@ -54,6 +59,10 @@ Roo.XTemplate = function()
 
 Roo.extend(Roo.XTemplate, Roo.Template, {
 
+    /**
+     * The various sub templates
+     */
+    tpls : false,
     /**
      *
      * basic tag replacing syntax
@@ -65,7 +74,12 @@ Roo.extend(Roo.XTemplate, Roo.Template, {
      */
     re : /\{([\w-\.]+)(?:\:([\w\.]*)(?:\((.*?)?\))?)?\}/g,
 
-    
+    /**
+     * compile the template
+     *
+     * This is not recursive, so I'm not sure how nested templates are really going to be handled..
+     *
+     */
     compile: function()
     {
         var s = this.html;
@@ -76,33 +90,39 @@ Roo.extend(Roo.XTemplate, Roo.Template, {
             nameRe = /^]*?for="(.*?)"/,
             ifRe   = /^]*?if="(.*?)"/,
             execRe = /^]*?exec="(.*?)"/,
+            namedRe = /^]*?name="(\w+)"/,  // named templates..
             m,
             id     = 0,
             tpls   = [];
     
         while(true == !!(m = s.match(re))){
-            var m2   = m[0].match(nameRe),
-                m3   = m[0].match(ifRe),
-                m4   = m[0].match(execRe),
+            var forMatch   = m[0].match(nameRe),
+                ifMatch   = m[0].match(ifRe),
+                execMatch   = m[0].match(execRe),
+                namedMatch   = m[0].match(namedRe),
+                
                 exp  = null, 
                 fn   = null,
                 exec = null,
-                name = m2 && m2[1] ? m2[1] : '';
+                name = forMatch && forMatch[1] ? forMatch[1] : '';
                 
-            if (m3) {
+            if (ifMatch) {
                 // if - puts fn into test..
-                exp = m3 && m3[1] ? m3[1] : null;
+                exp = ifMatch && ifMatch[1] ? ifMatch[1] : null;
                 if(exp){
                    fn = new Function('values', 'parent', 'with(values){ return '+(Roo.util.Format.htmlDecode(exp))+'; }');
                 }
             }
-            if (m4) {
+            
+            if (execMatch) {
                 // exec - calls a function... returns empty if true is  returned.
-                exp = m4 && m4[1] ? m4[1] : null;
+                exp = execMatch && execMatch[1] ? execMatch[1] : null;
                 if(exp){
                    exec = new Function('values', 'parent', 'with(values){ '+(Roo.util.Format.htmlDecode(exp))+'; }');
                 }
             }
+            
+            
             if (name) {
                 // for = 
                 switch(name){
@@ -111,27 +131,49 @@ Roo.extend(Roo.XTemplate, Roo.Template, {
                     default:   name = new Function('values', 'parent', 'with(values){ return '+name+'; }');
                 }
             }
+            var uid = namedMatch ? namedMatch[1] : id;
+            
+            
             tpls.push({
-                id:     id,
+                id:     namedMatch ? namedMatch[1] : id,
                 target: name,
                 exec:   exec,
                 test:   fn,
                 body:   m[1] || ''
             });
-            s = s.replace(m[0], '{xtpl'+ id + '}');
+            if (namedMatch) {
+                s = s.replace(m[0], '');
+            } else { 
+                s = s.replace(m[0], '{xtpl'+ id + '}');
+            }
             ++id;
         }
+        this.tpls = [];
         for(var i = tpls.length-1; i >= 0; --i){
             this.compileTpl(tpls[i]);
+            this.tpls[tpls[i].id] = tpls[i];
         }
         this.master = tpls[tpls.length-1];
-        this.tpls = tpls;
         return this;
     },
-    
+    /**
+     * same as applyTemplate, except it's done to one of the subTemplates
+     * when using named templates, you can do:
+     *
+     * var str = pl.applySubTemplate('your-name', values);
+     *
+     * 
+     * @param {Number} id of the template
+     * @param {Object} values to apply to template
+     * @param {Object} parent (normaly the instance of this object)
+     */
     applySubTemplate : function(id, values, parent)
     {
+        
+        
         var t = this.tpls[id];
+        
+        
         try { 
             if(t.test && !t.test.call(this, values, parent)){
                 return '';
@@ -212,7 +254,7 @@ Roo.extend(Roo.XTemplate, Roo.Template, {
                 udef_ar.push(  "(typeof(" + lookfor + ") == 'undefined')"  );
             });
             
-            var udef_st = '((' + udef_ar.join(" || ") +") ? udef('" + name + "') : "; // .. needs )
+            var udef_st = '((' + udef_ar.join(" || ") +") ? undef('" + name + "') : "; // .. needs )
             
             
             if(format && useF){
@@ -252,9 +294,9 @@ Roo.extend(Roo.XTemplate, Roo.Template, {
             body = body.join('');
         }
         
-        Roo.log(body.replace(/\\n/,'\n'));
+        Roo.debug && Roo.log(body.replace(/\\n/,'\n'));
        
-        /** eval:var:zzzzzzz */
+        /** eval:var:tpl eval:var:fm eval:var:useF eval:var:undef  */
         eval(body);
         
         return this;