Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Ext User
    Join Date
    Jun 2010
    Posts
    63
    Vote Rating
    0
    orangechicken is on a distinguished road

      0  

    Default [OPEN-297] the default renderTpl for Components/Containers is missing (null)

    [OPEN-297] the default renderTpl for Components/Containers is missing (null)


    In 0.93, Component declared a renderTpl (a div with baseCls, etc) but now in 0.94 the template has been removed (breaking lots of our code wherever we use basic Components and Containers). Can the renderTpl that now appears in Ext.lib.Panel be moved back up to Component?

  2. #2
    Sencha User Jamie Avins's Avatar
    Join Date
    Mar 2007
    Location
    Redwood City, California
    Posts
    3,661
    Vote Rating
    20
    Jamie Avins is a jewel in the rough Jamie Avins is a jewel in the rough Jamie Avins is a jewel in the rough

      0  

    Default


    Thank you for the report.

  3. #3
    Sencha User
    Join Date
    Mar 2007
    Location
    Haarlem, Netherlands
    Posts
    1,243
    Vote Rating
    10
    TommyMaintz will become famous soon enough TommyMaintz will become famous soon enough

      0  

    Default


    The reason for this is that in 0.94 renderTpl only applies to the inner structure of the component. The outer "el" of any component is created seperately. Could you provide some example code that broke because of this change so that I can help you determine how to reimplement that using the new structure?

  4. #4
    Ext User
    Join Date
    Jun 2010
    Posts
    63
    Vote Rating
    0
    orangechicken is on a distinguished road

      0  

    Default


    Sure. Not exact copy and paste, but the concept is this:

    Code:
    { cls: 'my-container', items: [{ xtype: 'component', html: '<h1>A header?</h1>', cls: 'header' }, { xtype: 'list', data: [...] }] }
    Obviously this is a little contrived. The purpose is to get the simplest component possible in the items. In 0.93, the "xtype: 'component'" part would render something like
    HTML Code:
    <div class='header'><h1>A header?</h1></div>
    In 0.94, it doesn't render.

  5. #5
    Ext User ueilat's Avatar
    Join Date
    Aug 2010
    Location
    Pino Torinese, Italy
    Posts
    23
    Vote Rating
    0
    ueilat is on a distinguished road

      0  

    Default


    same issue
    http://www.sencha.com/forum/showthre...473#post513473
    in addiction container also lost Id Property

  6. #6
    Sencha User
    Join Date
    Mar 2007
    Location
    Haarlem, Netherlands
    Posts
    1,243
    Vote Rating
    10
    TommyMaintz will become famous soon enough TommyMaintz will become famous soon enough

      0  

    Default


    I am not able to reproduce this with the latest source code in git. Can you confirm if the following code renders correctly with 0.95?

    Code:
    Ext.setup({
        tabletStartupScreen: 'tablet_startup.png',
        phoneStartupScreen: 'phone_startup.png',
        icon: 'icon.png',
        glossOnIcon: false,
        onReady: function() {
            var panel = new Ext.Panel({
                cls: 'my-container',
                fullscreen: true,
                items: [{ 
                    xtype: 'component', 
                    html: '<h1>A header?</h1>', 
                    cls: 'header' 
                }] 
            });
        }
    });

  7. #7
    Ext User ueilat's Avatar
    Join Date
    Aug 2010
    Location
    Pino Torinese, Italy
    Posts
    23
    Vote Rating
    0
    ueilat is on a distinguished road

      0  

    Default


    I answered in the previous linked post. It's waiting the moderator approval.
    thanks in advance

  8. #8
    Ext User ueilat's Avatar
    Join Date
    Aug 2010
    Location
    Pino Torinese, Italy
    Posts
    23
    Vote Rating
    0
    ueilat is on a distinguished road

      0  

    Default


    I post also here because I cannot see my post in the other message.
    Here my codes, prototype of my development site.
    As you can test in 0.93 it works, in 0.94 doesn't update and doesn't create id associated to same element (checked in safari developer tool)
    Code:
    <html>
     <head>
         <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
         <title>Fiorentina.it</title>
    
    	 <!-- Ext Touch CSS -->
    <script>
    function loggo(cosa) {
     console.log(cosa);
    };
    percorsobase='http://www.fiorentina.it/iphone/me2/';
    
    </script>
    
    	 <link rel="stylesheet" href="sencha-touch-beta-0.95/resources/css/ext-touch.css" type="text/css">
    
    
    
    
    
    	 <!-- Ext Touch JS -->
    
    
    
    	 <script type="text/javascript" src="sencha-touch-beta-0.95/ext-touch-debug.js"> </script>
    
    
    
    	 <!-- Application JS -->
    	<script>
    var blocchi=new Array();
    var blocchimax=10;
    for (var i=0;i<=blocchimax;i++) {
     blocchi[i]=null;
    };
               var barrasencha=42;
               
               
    Ext.setup({
        tabletStartupScreen: 'tablet_startup.png',
        phoneStartupScreen: 'phone_startup.png',
        icon: 'icon.png',
        glossOnIcon: false,
        onReady: function() {
    
    
    
      var modale=function(testo) {
             if (testo!="")  { 
                Ext.getBody().mask(false, '<div class="modale">'+ testo +'&hellip;</div>');
              } else {
                Ext.getBody().unmask();
             }
          };  
    
    
          var chiama=function(tipopaginax,parametrix) {
          //loggo('chiamando');
            modale('carico');
            generapagina(tipopaginax,1,parametrix)
          };
    
    
          var generapagina=function(tipopagina,tiporigen,parametri){
    
    
    
    
    
              blocchi[1]=new Ext.Container({
                cls: 'titolihome',
                html: 'News',
                height: 20,
                monitorOrientation : false
              });
              ct.add(blocchi[1]);
              blocchi[2]=new Ext.Container({
                cls: 'listahome',
                id: 'listahome1',
                tpl: '<tpl for="."><div class="lista" onclick="javascript:lancialista({idnotizia},2,this)"><div class=testo1><b>{datanotizia}</b> {titolo}</div></div></tpl>',
                monitorOrientation : false
              });
              blocchi[6]=new Ext.Container({
                height: (480-barrasencha-20-20)/2,
                items: blocchi[2],
                monitorOrientation : false
             });         
              ct.add(blocchi[6]);
              blocchi[3]=new Ext.Container({
                cls: 'titolihome',
                html: 'In primo piano',
                height: 20,
                monitorOrientation : false,
              });
              ct.add(blocchi[3]);
              blocchi[4]=new Ext.Container({
                cls: 'listahome',
                id: 'listahome2',
                tpl: '<tpl for="."><div class="lista" onclick="javascript:lancialista({idnotizia},2,this)"><div class=testo1><tpl if="foto"><img align=right src="{foto}"></tpl><b class=titoletti>{titolo}</b><br/>{descrizione}</div></div></tpl>',
                monitorOrientation : false
             });
             blocchi[5]=new Ext.Container({
                height: (480-barrasencha-20-20)/2,
                items: blocchi[4],
                monitorOrientation : false
             });
              ct.add(blocchi[5]);
              barratop.insert(0,{ xtype: 'button', text: '?', ui: 'normal', handler: alert});
             // barratop.insert(0,{ iconCls: 'info', ui: 'mask'});
              barratop.insert(1, {xtype: 'spacer'});
    
              barratop.insert(3, {xtype: 'spacer'});
              barratop.insert(4,{ui: 'mask', iconCls: 'credit', handler: alert});
              barratop.doLayout();
              ct.doLayout();
              //document.getElementById('selettore').setActive(0);
     //         scrollaPrivato(document.getElementById('listahome1'),document.getElementById('listahome1').parentNode,false,true,1);
     //         scrollaPrivato(document.getElementById('listahome2'),document.getElementById('listahome2').parentNode,false,true,1);	 
              //alert(document.getElementById(blocchi[4].getEl().id).style.top);
    
    
              blocchi[2].update([{
                datanotizia: 'Item 1',
                titolo: '1'
            }, {
                datanotizia: 'Item 2',
                titolo: '2'            
            }, {
                datanotizia: 'Item 2',
                titolo: '3'            
            }]);
                  blocchi[2].doLayout();
     //             blocchi[3].add(memoria[genpaginap1].dati["altrenews"]);
    //              blocchi[3].doLayout();          
                  blocchi[4].update([{
                datanotizia: 'Item 1',
                titolo: '1'
            }, {
                datanotizia: 'Item 2',
                titolo: '2'            
            }, {
                datanotizia: 'Item 2',
                titolo: '3'            
            }]);
                  blocchi[4].doLayout();
                  
                  
                 modale('');  
                  
      }
    //**********************************+'
    
    
    
        
        
          modale('carico');
            //GESTISCO VARIABILI PERMANENTI
            //localStorage.setItem("fontsize", 1);
            //localStorage.clear();
       
           document.body.innerHTML='';
        
            
            //loggo('configurato');         
                     
                     
            barratop = new Ext.Toolbar({
                // dock this toolbar at the top
                ui: 'dark',
                dock: 'bottom',
                cls: 'barratop',
                monitorOrientation: false /*,
                items: [ {xtype: 'spacer',
                          id:'fisso1'} ,
                       { html: '<img src="images/logo.png">',
                           xtype:'container',
                           centered:true,
                           id: 'fisso2'
                           },   
                         {xtype: 'spacer',
                          id:'fisso3'}
                          ] */
            });
    
                
          //QUESTO E' IL CONTENITORE PRINCIPALE
          ct = new Ext.Panel({
                fullscreen: true,
                cls: 'sfondo',
                dockedItems: barratop,
                monitorOrientation: false
    
              //  onOrientationChange : function(orientation, w, h) {
                //    //loggo('ruoto ' + this.id+ ' - ' + orientation + ' ' + w + 'x' + h);
               // }
     
                
          });
          
     
          //loggo('chiamo');
    
          lanciatoInizio=true;
          chiama(1,'');
         
         
          
          //NKAlert(NKGetLibraryVersion());
    
        
        }
    });
    	</script>
    
     </head>
     <body> <h1>Application starting....</h1></body>
     </html>

Similar Threads

  1. Packages, Containers, Components and Classes??
    By Hollywood in forum Ext 3.x: Help & Discussion
    Replies: 2
    Last Post: 4 Aug 2010, 9:25 AM
  2. Replies: 3
    Last Post: 25 Apr 2010, 6:43 PM
  3. Replies: 13
    Last Post: 9 Feb 2010, 8:45 AM
  4. Referencing components in containers
    By dlipski in forum Ext 3.x: Help & Discussion
    Replies: 0
    Last Post: 13 Nov 2009, 7:41 AM
  5. Components inside containers don't render
    By nugatto in forum Ext 2.x: Help & Discussion
    Replies: 14
    Last Post: 4 Dec 2008, 5:32 AM

Thread Participants: 3