实例化我的扩展Ext JS FormPanel的实例时发生TypeError

时间:2010-12-30 18:20:33

标签: javascript extjs formpanel

我的javascript中有以下FormPanel

EditRequestForm = Ext.extend(Ext.form.FormPanel, {
    labelWidth: 75,
    bodyStyle: 'padding:5px 5px 0',
    width: 350,
    defaults: { width: 230 },

    items: [{
        name: 'id',
        hidden: true
    }, {
        fieldLabel: 'Name',
        name: 'name',
        allowBlank: false
    }, {
        fieldLabel: 'Test Plan File',
        name: 'testplan'
    }, {
        fieldLabel: 'Scheduled Time',
        name: 'scheduledtime'
    }],

    buttons: [{
        text: 'Save'
    }, {
        text: 'Cancel'
    }]
});

当我尝试使用以下代码创建此实例时:

        var form = new EditRequestForm({
            header: false
        });

发生以下异常:

Uncaught TypeError: Object [object Object],[object Object],[object Object],[object Object] has no method 'add'

我看不出任何错误。如果我拿出header: false电话,同样的事情发生了,所以不是这样。

我做错了什么?

3 个答案:

答案 0 :(得分:3)

这可能不是最佳解决方案,但它为我删除了js错误。

EditRequestForm = Ext.extend(Ext.form.FormPanel, {
        labelWidth: 75,
        bodyStyle: 'padding:5px 5px 0',
        width: 350,
        defaults: {
            width: 230
        },
        initComponent: function () {
            Ext.apply(this, {
                renderTo: Ext.getBody(),
                items: [{
                    name: 'id',
                    hidden: true
                },
                {
                    fieldLabel: 'Name',
                    name: 'name',
                    allowBlank: false
                },
                {
                    fieldLabel: 'Test Plan File',
                    name: 'testplan'
                },
                {
                    fieldLabel: 'Scheduled Time',
                    name: 'scheduledtime'
                }],
                buttons: [{
                    text: 'Save'
                },
                {
                    text: 'Cancel'
                }]
            });
            EditRequestForm.superclass.initComponent.apply(this, arguments);

答案 1 :(得分:1)

您没有正确扩展组件。您的代码缺少两个主要部分:

  1. initComponent:{} //这是您的商品应该用于“默认”配置的地方
  2. 注册xtype
    Ext.reg("myRequestForm","EditRequestForm");
  3. 请参阅ExtJS教程,以便在this link

    扩展组件

答案 2 :(得分:0)

传递给Ext.extend的数据应该传递给表单构造函数。您似乎没有尝试使用传递给Ext.extend的数据创建新类;相反,它似乎是你试图实例化一个表单对象。试试这个:

EditRequestForm = new Ext.form.FormPanel({
        labelWidth: 75,
        bodyStyle: 'padding:5px 5px 0',
        width: 350,
        defaults: { width: 230 },

        items: [{
            name: 'id',
            hidden: true
        }, {
            fieldLabel: 'Name',
            name: 'name',
            allowBlank: false
        }, {
            fieldLabel: 'Test Plan File',
            name: 'testplan'
        }, {
            fieldLabel: 'Scheduled Time',
            name: 'scheduledtime'
        }],

        buttons: [{
            text: 'Save'
        }, {
            text: 'Cancel'
        }]
    });