Question

我想知道我设置Panel的方式有什么问题。与数据视图一起，我想要包含一个fileupload，但它似乎没有显示在面板本身（只有数据视图）。有关如何执行此操作或如何更正它的任何方法？感谢帮助。\

var iPanel= new Ext.panel.Panel({                                    
                                width: 490,
                                height: 500,
                                layout: 'fit',
                                title: 'Select an avatar',
                                floating: true,
                                closable : true,
                                items: {
                                    extend: 'Ext.view.View',
                                    xtype: 'dataview',
                                    id: 'myDataView',
                                    autoHeight:true,
                                    reference: 'dataview',
                                    itemSelector: 'div.dataview-multisort-item',
                                    store: Ext.create('Admin.store.users.UsersAvatarStore'),
                                    tpl: [
                                        '<tpl for=".">',
                                            '<div>',
                                               '<a href="#">',
                                                   '<img id="{name}" src="resources/images/default-avatars/{thumb}" height="72" weigh="72"/>',
                                               '</a>',
                                            '</div>',
                                        '</tpl>',
                                         ]                                     
                                }, 
                               {
                                  xtype: 'filefield',  //this does not show in panel
                                  id: 'form-file',
                                  emptyText: 'Select an image',
                                  fieldLabel: 'Photo',
                                  name: 'photo-path',
                                  buttonText: '',
                                  buttonConfig: {
                                  iconCls: 'upload-icon'
                                }
    }

Answer 1

您的代码中的问题是您正在使用

layout: 'fit'

将显示容器中的一个项目。参考：http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.layout.container.Fit

如果容器有多个项目，则所有项目的大小都相同。这通常是不希望的，因此为了避免这种情况，只在容器中放置一个项目。所有项目的大小可以用于提供背后的背景图像＆＃34;另一项如数据视图，如果您也绝对定位项目。

将布局切换到任何其他布局，它将起作用。

JS小提琴：https://jsfiddle.net/hxscf26h/

EXTJS Fileupload不会与面板内的dataview一起显示

1 个答案: