define Ext.form.Panel disallow to use Ext.Direct load

[salamoun]

Hello,
I have trouble with loading form over Ext.Direct, that are defined using Ext.define.

When I create form with Ext.create then Ext.Direct api call for load works perfectlly.
When I create form using Ext.define with same configuration, the load doesn't work. Api load function isn't called.

Using Ext.create, calling API load function works fine:

var basicInfo = Ext.create('Ext.form.Panel', {
    // configs for FormPanel
    title: 'Basic Information',
    border: false,
    bodyPadding: 10,
    // configs for BasicForm
    api: {
        load: configurationServiceImpl.getSoundConf
    },
    paramsAsHash: true,    
    defaultType: 'textfield',
    defaults: {
        anchor: '100%'
    },
    items: [{
        xtype: 'checkbox',
        name: 'enabled',
        boxLabel: 'Povolit zvuk'
    },{
        xtype: 'slider',
        name: 'volume',
        fieldLabel: 'Hlasitost',
        width: 200,
        value: 50,
        increment: 10,
        minValue: 0,
        maxValue: 100    
    }]
});

basicInfo.getForm().load({
    params: {
       confId: '1'
    }
});

But with Ext.define same class configuration and API call for load form doesn't works:

Ext.define('Test2', {
    extend: 'Ext.form.Panel',
    // configs for FormPanel
    title: 'Basic Information',
    border: false,
    bodyPadding: 10,
    // configs for BasicForm
    api: {
        load: configurationServiceImpl.getSoundConf
    },
    paramsAsHash: true,
    defaultType: 'textfield',
    defaults: {
        anchor: '100%'
    },
    items: [{
        xtype: 'checkbox',
        name: 'enabled',
        boxLabel: 'Povolit zvuk'
    },{
        xtype: 'slider',
        name: 'volume',
        fieldLabel: 'Hlasitost',
        width: 200,
        value: 50,
        increment: 10,
        minValue: 0,
        maxValue: 100    
    }]
});
var basicInfo = new Test2();

basicInfo.getForm().load({
    params: {
       confId: '1'
    }
});

Is it possible to create form using Ext.define and use API for Ext.Direct call?

[scottmartin]

You are still under construction so to speak ... Have a look at initComponent() when using define

 initComponent: function () {
..
     this.callParent(arguments);
}

Scott.

[salamoun]

Thanks, for help... I don't know why, but this works

Ext.define('sokjs.ui.configurationView.SoundForm', {
    extend: 'Ext.form.Panel',
    initComponent: function () {
        var config = {
            api: {
                load: configurationServiceImpl.getSoundConf
            },
            paramsAsHash: true    
        };
        Ext.apply(this, config); 
        Ext.apply(this.initialConfig, config);        
        this.callParent();
    },        
    flex: 4,
    ...