ExtJs:TypeError:this.layout.layout不是函数

时间:2013-12-30 05:33:43

标签: javascript extjs extjs3

在我的J2EE Web应用程序中,有一个带有表单的窗口。当用户点击按钮时显示。

new Ext.Button({
        text : 'Assign Vehicle',
        handler : function() {
            showVehicleAssignWin();
                    }
    }

我的showVehicleAssignWin()函数位于TourPlan.js文件中。这是我的TourPlan.js文件。

function showVehicleAssignWin(){
assignVehicleWin.show(this);

}

我的assignVehicleWin窗口在DataEntryForms.js文件中声明。

var assignVehicleWin;

var assignVehicleForm = new Ext.FormPanel({
frame : true,
labelWidth : 200,
labelAlign : 'left',
// renderTo:document.body,
autoScroll : true,
// defaultType: 'displayfield',
bodyStyle : {
    "background-color" : "#000000",
    "padding" : "10px"
},
/*
 * layout : { type : 'vbox', align : 'center' }, defaults : { labelWidth :
 * 200, padding : '10 10 10 25' },
 */

items : [ {
    xtype : 'combo',
    name : 'include_type',
    fieldLabel : '00Vehicle Registration Number',
    editable : false,
}, {
    xtype : 'combo',
    name : 'include_type',
    fieldLabel : '00Device ID',
    editable : false,
}, {
    xtype : 'combo',
    name : 'include_type',
    fieldLabel : '00Default Rep',
    editable : false,
}, {
    xtype : 'combo',
    name : 'include_type',
    fieldLabel : '00Driver',
    editable : false,
}, {
    xtype : 'combo',
    name : 'include_type',
    fieldLabel : '00Assistant',
    editable : false,
}, {
    xtype : 'combo',
    name : 'include_type',
    fieldLabel : '00Porter 1',
    editable : false,
}, {
    xtype : 'combo',
    name : 'include_type',
    fieldLabel : '00Porter 2',
    editable : false,
}, {
    xtype : 'combo',
    name : 'include_type',
    fieldLabel : '00Porter 3',
    editable : false,
},

],
buttons : [ {
    text : 'Delete',
    handler : function() {

    }
}, {
    text : 'View',
    handler : function() {

    }
}, {
    text : 'New',
    handler : function() {

    }
}, {
    text : 'Exit',
    handler : function() {
        assignVehicleWin.hide();
    }
} ]
});

assignVehicleWin = new Ext.Window({
title : 'Vehicle Assigning',
layout : 'fit',
// autoScroll: true,
// y: 120,
width : 480,
height : 530,
minWidth : 480,
minHeight : 530,
resizable : false,
draggable : true,
// modal: true,
plain : true,
// bodyStyle:'padding:8px;',
// buttonAlign:'center',
closeAction : 'hide',
// floating: true,
closable : true,
items : [ assignVehicleForm ]
});

我必须单击按钮两次才能显示窗口。窗户也出现了,但它是空的。 FireBug控制台说

TypeError: this.layout.layout is not a function

我正在使用ExtJs 3.0。

任何人都知道这里发生了什么?请帮我纠正这个错误。

谢谢

1 个答案:

答案 0 :(得分:0)

我为您准备了一个示例代码。我希望它会对你有所帮助。 没有必要使用Ext.namespace();.

<强> WindowLayout.js

    
var assignVehicleWin;

var assignVehicleForm = new Ext.FormPanel({
frame : true,
labelWidth : 200,
labelAlign : 'left',
autoScroll : true,
bodyStyle : {
    "background-color" : "#000000",
    "padding" : "10px"
},
defaults : {    

},
items : [{
    fieldLabel : '00Vehicle Registration Number',

},{
    fieldLabel : '00Device ID'
},{
    fieldLabel : '00Default Rep'
}, {
    fieldLabel : '00Driver'
}, {
    fieldLabel : '00Assistant'
}, {
    fieldLabel : '00Porter 1'
}, {
    fieldLabel : '00Porter 2'
}, {
    fieldLabel : '00Porter 3'
}],
buttons : [{
    text : 'Delete',
    handler : function() {

    }
},{
    text : 'View',
    handler : function() {

    }
},{
    text : 'New',
    handler : function() {

    }
},{
    text : 'Exit',
    handler : function() {
        assignVehicleWin.hide();
    }
}]
});

assignVehicleWin = new Ext.Window({
    title : 'Vehicle Assigning',
    layout : 'fit',
    width : 480,
    height : 530,
    minWidth : 480,
    minHeight : 530,
    resizable : false,
    draggable : true,
    plain : true,
    closeAction : 'hide',
    items : assignVehicleForm
});

<强> Panel.js

    Ext.onReady(function(){
var BorderEx = new Ext.Panel({
    renderTo : Ext.getBody(),
    width : 300,
    height : 300,
    style : "margin : 10px 10px 10px 10px;", /* MARGINS config used in boxlayout Or border layout only */
    title : 'test for stackoverflow',
    monitorResize : true,
    items : [{
        xtype : 'button',
        width : 50,
        height : 50,
        text : 'Open Window',
        handler : function() {
            assignVehicleWin.show();
        }
    }]
});

});

注意:请确保这两个文件都在 index.html

中注册