0

次のような状況があります。Ext.form.field.File(上にドッキングされたツールバーの上にある上に (のbuttonOnly: true上Ext.form.Panelに) がありますExt.grid.Panel。その結果、ボタンはツールバーとはまったく異なるスタイルを持ち、パネルにはボタンの周りに空白があるようです。ボタンとパネルのスタイルがツールバーと一致するように、これをどのように修正できるかについて、誰でも提案があります（私はデフォルトのスタイルを使用し、何も変更しませんでした）。

編集:ここにいくつかのコードがあります:

upload_button = Ext.create('Ext.form.field.File', {
            buttonOnly: true,
            buttonText: "Upload File",
            hideLabel: true,
            listeners: {..}

        });

        button_panel = Ext.create('Ext.form.Panel', {
            region: 'south',
            items: upload_button
        });


  upload_toolbar = Ext.create('Ext.toolbar.Toolbar',{
            width: 400,
            region: 'north',
            dock: 'top',
            items: [ button_panel]});

grid_file = Ext.create('Ext.grid.Panel', {
            title: 'File List',
            region: 'center',
            height: 300,
            store: store_file,
            dockedItems: [upload_toolbar],
4

1 に答える 1

1

borderリージョンを使用していますが、レイアウトが表示されません。

あなたの問題は、ツールバー内にパネルを配置しようとしていることです-それは機能しません。

ページのどこかに非表示のアップロードフォームを配置することをお勧めします。ツールバーに通常のボタンを配置し、ツールバーのボタンを押すと、非表示のフォームが押されます。

したがって、これは非表示のアップロードフォーム定義になります。

Ext.define('App.view.Assignments' ,
{
    extend: 'Ext.panel.Panel',
    alias: 'widget.assignments-panel',

    hidden: true,

    items: [{
        xtype: 'filefield',
        id: 'uploadField',
        emptyText: 'Select a file',
        fieldLabel: 'Assignment',
        name: 'assignment-path',
        buttonText: '...',
        buttonConfig: {
            iconCls: 'upload-icon'
        }
    },{
        xtype: 'hidden',
        id:    'submissionIdField',
        name:  'submissionId',
        value: ''
    }],
});

そして、表示されている更新ボタンを押すと、次のことができます。

var uploadField = Ext.getCmp( 'uploadField' );
uploadField.fileInputEl.dom.click();
于 2012-12-06T14:18:51.750 に答える