extjs在chrome中正常工作,但在firefox或ie中没有显示任何内容

时间:2012-08-06 14:30:43

标签: javascript html firefox google-chrome extjs

我已在Chrome中正确使用此代码,但在Firefox中我无法看到任何更改,只是空白页。在控制台没有错误。所有文件都已加载。 我不是前端开发人员,我在python,ruby和java上写过,也许我做错了什么? 但... 到底是怎么回事?!它让我大吃一惊。

它的MVC应用程序,我有很多级别的嵌套文件(带组件)

模板

<html>
<head>
    <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}extjs/resources/css/ext-all.css" />
    <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/style.css" />

    <script src="{{ STATIC_URL }}extjs/ext-dev.js" type="text/javascript" charset="utf-8"></script>
    <script src="{{ STATIC_URL }}app.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
</body>
</html>

app.js

Ext.Loader.setConfig({
    enabled: true,
    disableCaching: false,
    paths: {C300App: '/static/c300app', Ext: '/static/extjs/src'}
});
Ext.require([
]);

Ext.application({
    name: 'C300',
    appFolder:'/static/c300app',
    autoCreateViewport: true,
    controllers: ['Base'],
    models: [],
    views: [
            'Viewport'
            ,'Left'
            ,'CenterBase'
            ,'Header'
            ,'Footer'
    ],
    launch: function() {
    }
});

Ext.define('C300.view.Viewport', {
    extend: 'Ext.container.Viewport',
    layout: 'border',
    requires:[
        'C300.view.Header'
        ,'C300.view.Footer'
        ,'C300.view.Left'
        ,'C300.view.CenterBase'
    ],
    initComponent: function() {
        var me = this;
        Ext.applyIf(me, {
            border:true,
            items: [
                Ext.create('C300.view.Header',{
                    region: 'north'
                }),
                Ext.create('C300.view.Left',{
                    region: 'west'
                }),
                Ext.create('C300.view.CenterBase', {
                    region: 'center'
                }),
                Ext.create('C300.view.Footer',{
                    region: 'south'
                })
            ]
        });
        this.callParent();
    }
});

CenterBase

Ext.define('C300.view.CenterBase', {
    extend: 'Ext.tab.Panel',
    alias: 'widget.centerBase',
    itemId: 'centerBase',

    initComponent: function() {
        Ext.applyIf(this, {
            stateId: 'center-panel',
            collapsible: false,
            animCollapse: true,
            layoutConfig: {
                titleCollapse: false,
                animate: true,
                activeOnTop: true
            },
            deferredRender: false,
            activeTab: 0,
            items: [{
                title: 'Информация'
                ,closable: true
                ,autoScroll: true
                ,html: '</br><p style="margin-left:10px;">Welcome!</p>'
            }]

        });
        this.callParent(arguments);
    }
});

控制器

Ext.define('C300.controller.Base', {
    extend: 'Ext.app.Controller',
    views: [
        'Viewport'
        ,'Left'
        ,'CenterBase'
        ,'items.ItemWorkers'
        ,'items.ItemOrganization'
        ,'items.ItemServices'
    ],
    refs: [
        {
            ref: 'itemWorkers',
            selector: '#itemWorkers'
        },{
            ref: 'itemOrganization',
            selector: '#itemOrganization'
        },{
            ref: 'itemServices',
            selector: '#itemServices'
        },{
            ref: 'centerBase',
            selector: '#centerBase'
        }
    ],

    init: function() {
        console.log('Testing log');
        this.control({
            'button': {
                click: function() {console.log('Tab click')}
            },
            '#itemWorkers':{
                itemclick:function(view,rec,item,index,eventObj){
                    this.onElementClick(rec.data.id, rec.data.text)
                }
            },
            '#itemOrganization':{
                itemclick:function(view,rec,item,index,eventObj){
                    this.onElementClick(rec.data.id, rec.data.text)
                }
            },
            '#itemServices':{
                itemclick:function(view,rec,item,index,eventObj){
                    this.onElementClick(rec.data.id, rec.data.text)
                }
            }
        });
    },

    onContentChange: function onload() {
        console.log('FFFFFF');
    },

    onElementClick: function(id, title) {
        console.log('tab is:'+title);
        var t = this.getCenterBase();
        var g = t.items.findIndex('title', title);

        if (g >= 0){
            console.log(g);
            t.setActiveTab(g);
        } else {
            t.add({
                title : title,
                html : 'i am tab ',
                closable : true
            });
            var current = t.items.findIndex('title', title);
            t.setActiveTab(current);
        }

    }
});

1 个答案:

答案 0 :(得分:0)

我找到了答案。 需要从控制器中删除。

  'items.ItemWorkers'
  ,'items.ItemOrganization'
  ,'items.ItemServices'

我不知道为什么ext不使用子文件夹