ExtJSのフィールドの隣にあるラベル4

Question

ファイル選択フィールドのコンポーネントと、隣り合って表示するラベル（右のラベル）があります。それらはどちらも関数内に配置されています。フィールドのラベルではなく、アップロードフィールドのファイルサイズを警告するテキストだけです。これはコードです：

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' 
} 
); 

Answer 1

私はいくつかcontainerへとlayoutがhboxのように設定よりも、それらを置くでしょう。 あなたは、たとえばあなたがレイアウトを設定することができます何かを使用することができます

• fieldcontainer
• container
• fieldset

のために使用することができます。 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