Search code examples
extjsextjs4

How to set search box to the center?

How to set a Search Box/Text Field to the center of tool bar?

Here is the code I am using...

Ext.create('Ext.toolbar.Toolbar', {
    renderTo: document.body,
    width   : 500,
    items: [
        {
            text: 'Button1'
        },
        '->',
        {
            xtype    : 'textfield',
            name     : 'field1',
            emptyText: 'Enter search term'
        },
        '-',
        {
            text: 'Button2'
        }
    ]
});

Note : I am using Extjs 4.2.1

Solution

  • Just add '->' or { xtype: 'tbfill' } also after textfield definition:

    items: [
    {
        text: 'Button1'
    },
    '->',
    {
        xtype    : 'textfield',
        name     : 'field1',
        emptyText: 'Enter search term'
    },
    '->',
    '-',
    {
        text: 'Button2'
    }
]