[4.1 RC1] Toolbar that contains the error in datefield

[Hoyeol]

[4.1 RC1] Toolbar that contains the error in datefield

REQUIRED INFORMATION




Ext version tested:

• Ext 4.1 RC1

Browser versions tested against:
Any


Description:

• Toolbar that contains the error in datefield. Error message is 'Layout run failed'. Not displayed on the screen.

Steps to reproduce the problem:

• Create a toolbar with a datefield.

The result that was expected:

• Displayed on the screen.

The result that occurs instead:

• Not displayed on the screen. Error message: Layout run failed. ext-all-dev.js:10763

Test Case:

Code:

Ext.define('Test.view.ui.SearchToolbar', {
extend: 'Ext.toolbar.Toolbar',




initComponent: function() {
var me = this;


Ext.applyIf(me, {
items: [
{
xtype: 'fieldcontainer',
itemId: 'searchPeriodDateFieldContainer',
margin: '0 5 0 0',
layout: {
type: 'column'
},
items: [
{
xtype: 'datefield',
itemId: 'startDateField',
margin: '0 10 0 0',
width: 150,
fieldLabel: 'Start',
labelWidth: 50,
format: 'Y-m-d'
},
{
xtype: 'datefield',
itemId: 'endDateField',
width: 150,
fieldLabel: 'End',
labelWidth: 50,
format: 'Y-m-d'
}
]
},
{
xtype: 'button',
itemId: 'searchButton',
iconCls: 'icon16-find',
text: 'Search'
}
]
});


me.callParent(arguments);
}
});

[mankz]

Not related to datefield, simpler test case:

Ext.define('Foobar', {
            extend: 'Ext.toolbar.Toolbar',

            constructor: function () {
                var me = this;

                Ext.apply(me, {
                    items: [
                    {
                        xtype: 'fieldcontainer',
                        layout: { type : 'hbox', align : 'stretchmax' },
                        items: [
                                {
                                    width: 150
                                }
                            ]
                        }
                    ]
                });

                me.callParent(arguments);
            }
        });

new Ext.Panel({ height : 100, tbar : new Foobar() }).render(document.body);

[Hoyeol]

You're right.
Test case: not used layout config.
No error found. but I want to use layout config.
How do I layout config is available?

Ext.Loader.setConfig({
    enabled: true
});

Ext.define('Test.view.ui.SearchToolbar', {
    extend: 'Ext.toolbar.Toolbar',

    initComponent: function() {
        var me = this;

        Ext.applyIf(me, {
            items: [
                {
                    xtype: 'fieldcontainer',
                    itemId: 'searchPeriodDateFieldContainer',
                    margin: '0 5 0 0',
/*                    layout: {
                        type: 'column'
                    },*/
                    items: [
                        {
                            xtype: 'datefield',
                            itemId: 'startDateField',
                            margin: '0 10 0 0',
                            width: 150,
                            fieldLabel: 'Start',
                            labelWidth: 50,
                            format: 'Y-m-d'
                        },
                        {
                            xtype: 'datefield',
                            itemId: 'endDateField',
                            width: 150,
                            fieldLabel: 'End',
                            labelWidth: 50,
                            format: 'Y-m-d'
                        }
                    ]
                },
                {
                    xtype: 'button',
                    itemId: 'searchButton',
                    iconCls: 'icon16-find',
                    text: 'Search'
                }
            ]
        });

        me.callParent(arguments);
    }
});

Ext.onReady(function() {
    new Ext.Panel({ height : 100, tbar : new Ext.create('Test.view.ui.SearchToolbar') }).render(document.body);
});