javascript 如何右对齐 ExtJS tbar 的内容?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5141630/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-25 16:07:42  来源:igfitidea点击:

How can I right-align the contents of a ExtJS tbar?

javascriptextjs

提问by Edward Tanguay

I have a tbar inside a grid panel like this:

我在这样的网格面板中有一个 tbar:

enter image description here

在此处输入图片说明

This is the code that produces it:

这是产生它的代码:

var grid = new Ext.grid.GridPanel({
    region: 'center',
    style: 'margin: 10px',
    store: new Ext.data.Store({
        data: myData,
        reader: myReader
    }),
    title: 'Testing',
    tbar: ['Filters:', {
            width:          100,
            xtype:          'combo',
            mode:           'local',
            value:          'en',
            triggerAction:  'all',
            forceSelection: true,
            editable:       false,
            fieldLabel:     'Produkt',
            name:           'language',
            hiddenName:     'language',
            displayField:   'name',
            valueField:     'value',
            store:          new Ext.data.JsonStore({
                fields : ['name', 'value'],
                data   : [
                    {name : 'German',   value: 'de'},
                    {name : 'English',  value: 'en'},
                    {name : 'French', value: 'fr'}
                ]
            })

        }],

What do I need to change so that the dropbox is right-aligned instead of left-aligned?

我需要更改什么才能使 Dropbox 右对齐而不是左对齐?

Addendum

附录

thanks @dogbane, that works perfectly, here's how I right aligned both text and dropdown:

谢谢@dogbane,它完美地工作,这是我右对齐文本和下拉列表的方式:

tbar: [
    {xtype: 'tbfill'},
    'Filters:',
    {
        width:          100,
        xtype:          'combo',
        mode:           'local',
        ...

回答by dogbane

Try:

尝试:

{xtype: 'tbfill'}, // or '->'

See the docs for Ext.Toolbar.Fill.

请参阅Ext.Toolbar.Fill的文档。