Results 1 to 5 of 5

Thread: problems with this message "Ext.Container.LAYOUTS[this.layout.toLowerCase()] is not"

  1. #1
    Ext User
    Join Date
    Jul 2009
    Location
    Lima, Peru
    Posts
    5

    Question problems with this message "Ext.Container.LAYOUTS[this.layout.toLowerCase()] is not"

    I have problems with this message: "Ext.Container.LAYOUTS[this.layout.toLowerCase()] is not a constructor" I am designing a home page with a menu TreePanel. Tabs also be loaded dynamically. But when I run out the Custom Error that I can not identify the problem. please help.
    el code:

    Code:
    Ext.ns("com.sys.ccs");
    
    com.sys.ccs.PrincipalView = function(config) {
        this.north = config.north;
        this.west = config.west;
        this.menuTree = config.menuTree;
        this.center = config.center;
    
        config.items = [
            this.north
            ,this.west
            ,this.center
        ];
        i = 0;
    this.addTab = function addTab(e) {
        var tabs = this.center;
        var open = !tabs.getItem(e.id);
        if (open){
            var newPanel = new Ext.Panel({
                id : e.id,
                layout: 'fit',
                title: e.text,
                loadScripts: true,
                closable: true,
                border:false,
                iconCls:e.id,
                autoLoad: {
                    url: e.attributes.url + '?id=' + e.id,
                    border:false,
                    scripts: true,
                    scope: this
                }
            });
            this.center.add(newPanel);
            this.center.setActiveTab(newPanel);
        }
        else {
            this.center.setActiveTab(e.id);
        }
    }
    
    this.menuTree.on('click', function(node, e){
        if(node.isLeaf()){
            e.stopEvent();
            this.addTab(node);
        }
    },this);
    
    com.sys.ccs.PrincipalView.superclass.constructor.call(this, config);
    };
    Ext.extend(com.sys.ccs.PrincipalView, Ext.Viewport, {
    layout:'tdgi_border'
    });

  2. #2
    Sencha Premium User mankz's Avatar
    Join Date
    Nov 2007
    Location
    Stockholm, Sweden
    Posts
    3,153

    Default

    My guess is that this layout is not included in your source:

    Code:
    Ext.extend(com.sys.ccs.PrincipalView, Ext.Viewport, {
    layout:'tdgi_border'
    });

  3. #3
    Sencha Premium User mankz's Avatar
    Join Date
    Nov 2007
    Location
    Stockholm, Sweden
    Posts
    3,153

    Default

    Tip: Do a console.dir(Ext.Container.LAYOUTS) to see which layouts are defined.

  4. #4
    Ext User
    Join Date
    Jul 2009
    Location
    Lima, Peru
    Posts
    5

    Default

    So you see I'm using namespace and thus should the "Ext.extend(com.sys.ccs.PrincipalView, Ext.Viewport, {
    layout:'tdgi_border'
    });" is set outside the block of code.

    Full code:

    Code:
    Ext.ns("com.sys.ccs");
    
    com.sys.ccs.PrincipalView = function(config) {
        this.north = config.north;
        this.west = config.west;
        this.menuTree = config.menuTree;
        this.center = config.center;
    
        config.items = [
            this.north
            ,this.west
            ,this.center
        ];
        i = 0;
    
    this.addTab = function addTab(e) {
        var tabs = this.center;
        var open = !tabs.getItem(e.id);
        if (open){
            var newPanel = new Ext.Panel({
                id : e.id,
                layout: 'fit',
                title: e.text,
                loadScripts: true,
                closable: true,
                border:false,
                iconCls:e.id,
                autoLoad: {
                    url: e.attributes.url + '?id=' + e.id,
                    border:false,
                    scripts: true,
                    scope: this
                }
            });
            this.center.add(newPanel);
            this.center.setActiveTab(newPanel);
        }
        else {
            this.center.setActiveTab(e.id);
        }
    }
    
    this.menuTree.on('click', function(node, e){
        if(node.isLeaf()){
            e.stopEvent();
            this.addTab(node);
        }
    },this);
    
    com.sys.ccs.PrincipalView.superclass.constructor.call(this, config);
    };
    Ext.extend(com.sys.ccs.PrincipalView, Ext.Viewport, {
    layout:'tdgi_border'
    });
    
    
    Ext.ux.IFrameComponent = Ext.extend(Ext.BoxComponent, {
        ....
    });
    
    com.sys.ccs.PrincipalHeader = function(config) {
        ...
        ];
        com.sys.ccs.PrincipalHeader.superclass.constructor.call(this, config);
    }
    Ext.extend(com.sys.ccs.PrincipalHeader, Ext.Panel, {
        region: 'north',
        baseCls:'x-plain',
        id:'north',
        height:80,
        initComponent: function(){
            com.sys.ccs.PrincipalHeader.superclass.initComponent.apply(this);
        }
    });
    com.sys.ccs.PrincipalTree = function(config) {
    
            ...
            
            com.sys.ccs.PrincipalTree.superclass.constructor.call(this, config);
    }
    Ext.extend(com.sys.ccs.PrincipalTree, Ext.tree.TreePanel, {
            region: 'center',
            border : false,
            rootVisible: false,
            rootVisible: false,
            initComponent: function(){
                com.sys.ccs.PrincipalTree.superclass.initComponent.apply(this);
            }
    });
    Ext.onReady(function(){
            var principalTree = new com.sys.ccs.PrincipalTree({
                loader: new Ext.tree.TreeLoader(),
                //url: 'menu.php',
                root: new Ext.tree.AsyncTreeNode('menu.php')
            });
            var panelTree = new Ext.Panel({
                items : [principalTree],
                iconCls:'principal_mainmenu',
                split: true,
                autoScroll: true,
                region : 'west',
                width: 220,
                collapsedTitle: true,
                layoutConfig:{
                    animate : false
                },
                collapsible: true,
                title: 'Mdulos',
                margins : '0 0 5 5'
            });
            var principalHeader = new com.sys.ccs.PrincipalHeader({
    principalTree : principalTree
    });
    new com.sys.ccs.PrincipalView({
        layout: 'center',
        north: principalHeader,
        west: panelTree,
        menuTree : principalTree,
        center: new Ext.TabPanel({
            region: 'center',
            id : 'tabPanelCenter',
            border:false,
            activeTab: 0,
            enableTabScroll : true,
            items: {
                iconCls: 'principal_tabhome',
                title: 'Principal'
                
            }
        })
    });
    setTimeout(function(){
        Ext.get('loading').remove();
        Ext.get('loading-mask').fadeOut({remove:true});
    }, 250);
    })

  5. #5
    Sencha Premium User mankz's Avatar
    Join Date
    Nov 2007
    Location
    Stockholm, Sweden
    Posts
    3,153

    Default

    What does "this.layout" evaluate to when the error happens? Investigate in Firebug, should give the answer.

Similar Threads

  1. Replies: 6
    Last Post: 21 Apr 2010, 10:06 AM
  2. [CLOSED] Extends Ext.Panel / Layout: border / "calling" problems
    By Schenck in forum Ext 2.x: Help & Discussion
    Replies: 6
    Last Post: 17 Jun 2009, 2:47 AM
  3. replace the "south" with the "new Ext.StatusBar" in "layout:'border'"
    By ealpha in forum Ext 2.x: Help & Discussion
    Replies: 1
    Last Post: 18 May 2008, 8:28 PM
  4. Layout container's top border "separates" it from
    By Animal in forum Community Discussion
    Replies: 0
    Last Post: 4 Dec 2006, 8:47 AM

Posting Permissions

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