Question

大家好日子，当我使用ExtJS 4.1时，我经常遇到一个问题：每次我必须建立一个对象的引用时我都会付出很多努力，而且当我在一个对象上调用一个方法时，我得到一个像这样的错误：< / p>

未捕获的TypeError：无法调用未定义的方法'destroy'

例如，考虑以下情况我有一个包含两个项目的fieldset：fieldcontainer和一个按钮。我的目的是为按钮编写一个正确的处理函数，这样当我按下按钮时，fieldcontainer将被销毁。为此，我需要建立对fieldcontainer的正确引用。

这是我的代码：

xtype: 'fieldset',
id: 'product_fieldset',
title: 'Prodotti tempi e quantita',
defaultType: 'textfield',
layout: 'anchor',
items: [{
    xtype: 'fieldcontainer',
    layout: 'hbox',
    defaultType: 'textfield',
    defaults: {
        labelAlign: 'top'
    },
    items: [{
        xtype: 'combo',
        name: 'product',
    fieldLabel: 'Product',
    forceSelection: true,
    editable: false,
    store: products,
    queryMode: 'local',
    displayField: 'name',
    valueField: 'name',
    allowBlank: false,
    afterLabelTextTpl: required
    },{
        xtype: 'numberfield',
    name: 'p_on_weight', 
    fieldLabel: '% on weight',
    value: 0,
    minValue: 0,
    allowBlank: false,
    afterLabelTextTpl: required,
    hideTrigger: true,
    keyNavEnabled: false,
    mouseWheelEnabled: false
    },{
    xtype: 'numberfield',
    name: 'time', 
    fieldLabel: 'Time (minutes)',
    value: 0,
    minValue: 0,
    allowBlank: false,
    afterLabelTextTpl: required,
    hideTrigger: true,
    keyNavEnabled: false,
    mouseWheelEnabled: false
    },{
    xtype: 'numberfield',
    name: 'ph', 
    fieldLabel: 'Ph',
    minValue: 0,
    allowBlank: false,
    afterLabelTextTpl: required,
    hideTrigger: true,
    keyNavEnabled: false,
    mouseWheelEnabled: false
    },{
    xtype: 'textareafield',
    name: 'remarks',
    fieldLabel: 'Remarks'
}]
    },{
        xtype: 'button',
    text: 'Delete this product',
    handler: function() {
            proper_reference_to_fieldcontainer.destroy(); 
            //need help for previous line 
    }
    }]

那么，任何人都可以建议我使用fieldcontainer的方法，可能不使用fieldcontainer的id吗？（Sencha架构师建议不要使用id来建立引用）。

提前致谢。

恩里科。

Answer 1

您可以将容器定义为独立对象：

var myFieldContainer = Ext.Create('Ext.form.FieldContainer', {
    layout: 'hbox',
    defaultType: 'textfield',
    defaults: {
        labelAlign: 'top'
    },
    items: [{
        xtype: 'combo',
(...)
    });

...然后在按钮的配置中使用它：

{
    xtype: 'button',
    text: 'Delete this product',
    handler: function () {
        myFieldContainer.destroy();
    }
}

Answer 2

首先使用为fieldcontainer定义id值，

xtype: 'fieldcontainer',
id: 'my_id',
layout: 'hbox',

现在使用Ext.getCmp('my_id')检索对它的引用。

ExtJS 4.1：建立对象引用的问题

2 个答案: