ExtJS 4中字段旁边的标签

时间:2016-11-04 19:00:02

标签: javascript extjs layout extjs4

我有一个文件选择字段组件和一个我想让它彼此相邻的标签(右边的标签)。它们都填充在一个函数中。不是字段的标签,只是我希望它在上传字段中警告文件大小的文本。这是代码:

this.fileUploadField = Ext.widget('filefield',
{
  fieldLabel: 'Select a file:',
  name:'file',
  width: 200,
  buttonText: 'Button' });

  items.push(
  this.fileUploadField,
 {
    xtype: 'label',
    style: 'color:red',
    text: 'I'm the label that wants to appear on the right of the file upload field',
    name:'fileSizeLimit'
 }
);

1 个答案:

答案 0 :(得分:2)

我会将它们放入某些container而不是将layout设置为hbox。 你可以使用例如

您可以使用可以设置布局的任何内容。您可以使用flex配置正确定位字段。

所以代码看起来像这样:

xtype: 'fieldset',
title: 'My Fields',
layout: {
    type: 'hbox',
    align: 'stretch'
},
items: [{
    xtype: 'filefield',
    flex: 3,
    fieldLabel: 'Select file:'
}, {
    xtype: 'label',
    style: 'color:red',
    flex: 2,
    name: 'fileSizeLimit',
    text: 'I\'m the label that wants to appear on the right of the file upload field'
}]

看看这个小提琴: https://fiddle.sencha.com/#fiddle/1ju5