Results 1 to 2 of 2

Thread: 2.x PR3 rendering order question (or bug?)

Hybrid View

Previous Post Previous Post   Next Post Next Post
  1. #1
    Ext JS Premium Member
    Join Date
    Sep 2008
    Location
    Raleigh, NC
    Posts
    164
    Answers
    1
    Vote Rating
    9
      0  

    Default Unanswered: 2.x PR3 rendering order question (or bug?)

    Ok want to make sure I understand sencha 2.x, specifically PR3. So this is valid (tried to copy/paste reduced example so sorry if there is a small syntax issue):

    Code:
    var lookupForm = {
      title: 'Lookup',
      autoRender   : true,
                    modal        : true,
                    hideOnMaskTap: false,
                    height       : 505,
                    width        : 480,
                    centered     : true,
                    fullscreen   : true,
      items: [
        {
          xtype: 'checkboxfield',
          label: 'My Reviews and Cellar'
        }, {
          xtype: 'checkboxfield',
          name: 'search_type',
          label: 'Friends'
        }, {
          xtype: 'checkboxfield',
          label: 'Internet'
        }]
      };
    
    
    Ext.setup({
      onReady: function(){
    
        var bottomTabs = Ext.create('Ext.tab.Panel', {
          fullscreen: true,
          tabBar: {
            docked: 'bottom',
            ui: 'light',
            layout: {
              pack: 'center'
            }
          },
          items: [searchCard = Ext.create('Ext.tab.Panel', {
                  title: 'Search',
                  iconCls: 'search',
                    items: [Ext.create('Ext.form.Panel', lookupForm)]
                    })]
    
      })}
    });
    since it creates the form after the tabpanel after the outer panel, but this is invalid:

    Code:
    var lookupForm = Ext.create('Ext.form.Panel', {
      title: 'Lookup',
      autoRender   : true,
                    modal        : true,
                    hideOnMaskTap: false,
                    height       : 505,
                    width        : 480,
                    centered     : true,
                    fullscreen   : true,
      items: [
        {
          xtype: 'checkboxfield',
          label: 'My Reviews and Cellar'
        }, {
          xtype: 'checkboxfield',
          name: 'search_type',
          label: 'Friends'
        }, {
          xtype: 'checkboxfield',
          label: 'Internet'
        }]
    });
    
    var searchCard = Ext.create('Ext.tab.Panel', {
      title: 'Search',
      iconCls: 'search',
      items: [lookupForm]
    });
    
    Ext.setup({
      onReady: function(){
    
        var bottomTabs = Ext.create('Ext.tab.Panel', {
          fullscreen: true,
          items: [searchCard]
        });
    
      }
    });
    because the form was created before the tabpanel, etc? It appears to have rendering issues since the checkboxes are not checkable (although no errors in console)...or maybe this is a bug?

  2. #2
    Ext JS Premium Member
    Join Date
    Sep 2008
    Location
    Raleigh, NC
    Posts
    164
    Answers
    1
    Vote Rating
    9
      0  

    Default

    Ok so if we must create the components outer-to-inner in rendering order via:

    Ext.create(<type goes here>, <object goes here>);

    then I tried to specify xtypes and that automatically doing the Ext.create for it when its in the "items: []" for its parent that is invoked via Ext.create, but that doesn't seem to happen either.

    How do you expect us to not have to nest the whole app in one big spaghetti code pile? Hopefully this is just a new bug or some obvious misunderstanding.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •