打开extjs时,折叠面板不会创建滚动

时间:2011-12-13 13:01:05

标签: javascript html extjs extjs3

EXT V. 3.01

我有一个带边框布局的视口。

中心区域是一个tabpanel。

tabpanel活动选项卡在vbox布局中保存2个面板。

1)搜索小组。

2)网格转换面板。

搜索面板有2个字段集:

1)基本搜索

2)高级搜索

默认情况下,高级搜索字段集已折叠。

问题是,当我展开高级搜索字段集时,它会向下推动结果网格,但是没有滚动被打开,因此网格被推出视图而没有任何方法来丰富它。

我想在高级搜索字段集扩展时添加滚动。

以下是一些可能有用的代码:

Ext.extend(Ext.Viewport, {
     constructor: function (config) {
        config = Ext.apply({
        layout: 'border',
        items:[
            new Ext.TabPanel({
                activeTab: 0,
                region: 'center',
                items:[{
                        xtype:'panel',
                        title: this.localize.FillDetails,
                        layout: 'vbox',
                        items:[
                            this.searchPanels,
                            this.chooseInvoiceGrid
                        ]
                    }
                ]
            })
        ]
    },config);
     }
}

enter image description here

enter image description here

这是我的网格配置:

config = Ext.apply({
        store: this.storeProvider.getArChooseInvoiceStore(),
        stripeRows:true,
        loadMask: true,
        autoExpandMax: 2000,
        flex :1,
        tbar: this.searchBar,
        bbar: this.pagingBar,
        viewConfig: {
            deferEmptyText:false,
            emptyText: this.localize.NoInvoiceToDisplay
        },
        listeners: {
            // prevents default browser menu on client right click.
            render: function (grid) {
                grid.getEl().on('contextmenu', Ext.emptyFn, null, { preventDefault: true });
            },
            rowdblclick : this.onInvoiceClick 
        },
        columns: [
        {
            header: this.localize.OrderDivision,
            id: 'OrderingDepartment',
            dataIndex: 'OrderingDepartment',
            sortable:true,
            renderer: this.rendererFunction 
        }, {
            header: this.localize.RedRoute,
            dataIndex: 'RedRoute',
            sortable:true,
            width:50,
            renderer: this.rendererFunction
        }, {
            header: this.localize.DocumentType,
            dataIndex: 'DocumentType',
            sortable:true,
            renderer: function (value, metaData, record, rowIndex, colIndex, store) {
                if(value){
                    metaData.attr = 'title="'+value.Name+'"';
                    return value.Name;
                }
                else{
                    return '';
                }
            }
        }, {
            header: this.localize.InvoiceNumber,
            dataIndex: 'InvoiceNumber',
            sortable:true,
            renderer: this.rendererFunction
        }, {
            header: this.localize.SupplierName,
            dataIndex: 'SupplierName',
            sortable:true,
            renderer: this.rendererFunction
        } , {
            header: this.localize.InvoiceDate,
            dataIndex: 'InvoiceDate',
            sortable:true,
            width:80,
            renderer: this.rendererDateFunction
        }, {
            header: this.localize.ReceptionDate,
            dataIndex: 'InvoiceReceivedDate',
            sortable:true,
            width:80,
            renderer: this.rendererDateFunction
        } , {
            header: this.localize.InvoiceType,
            dataIndex: 'InvoiceType',
            sortable:true,
            renderer: function (value, metaData, record, rowIndex, colIndex, store) {
                if(value){
                    metaData.attr = 'title="'+value.Name+'"';
                    return value.Name;
                }
                else{
                    return '';
                }
            }
        }, {
            header: this.localize.AppliesInvoiceNum,
            dataIndex: 'ReferToInvoice',
            sortable:true,
            hidden:true,
            //width:150,
            renderer: this.rendererFunction
        }, {
            header: this.localize.SumWithVAT,
            dataIndex: 'SumIncludingVat',
            sortable:true,
            width:80,
            renderer: this.rendererFunction
        }, {
            header: this.localize.OrderCurrency,
            dataIndex: 'Currency',
            sortable:true,
            width:50,
            renderer: this.rendererFunction
        }, {
            header: this.localize.FinanceInvoiceType,
            dataIndex: 'AuthenticationDocumentType',
            sortable:true,
            renderer: function (value, metaData, record, rowIndex, colIndex, store) {
                if(value){
                    metaData.attr = 'title="'+value.Name+'"';
                    return value.Name;
                }
                else{
                    return '';
                }
            }
        }, {
            header: this.localize.OrderNumber,
            dataIndex: 'PurchaseOrderNumber',
            sortable:true,
            renderer: this.rendererFunction
        }, {
            header: this.localize.DeliveryNoteNumber,
            dataIndex: 'DeliveryNoteNumber',
            sortable:true,
            hidden:true,
            renderer: this.rendererFunction
        }, {
            header: this.localize.InvoiceStatus,
            dataIndex: 'InvoiceStatus',
            sortable:true,
            renderer: function (value, metaData, record, rowIndex, colIndex, store) {
                if(value){
                    metaData.attr = 'title="'+value.Name+'"';
                    return value.Name;
                }
                else{
                    return '';
                }
            }
        }, {
            header: this.localize.InvoiceCreatorName,
            dataIndex: 'SavedByUser',
            sortable:true,
            renderer: function (value, metaData, record, rowIndex, colIndex, store) {
                if(value){
                    metaData.attr = 'title="'+value.Name+'"';
                    return value.Name;
                }
                else{
                    return '';
                }
            }
        }, {
            header: this.localize.InvoiceTypeLinkage,
            dataIndex: 'Hatzmada',
            sortable:true,
            width:50,
            hidden:true,
            renderer: this.rendererFunction
        }, {
            header: this.localize.Leasing,
            dataIndex: 'Leasing',
            sortable:true,
            hidden:true,
            width:50,
            renderer: this.rendererFunction
        }, {
            header: this.localize.ValidationNumber,
            dataIndex: 'AuthenticationNumber',
            hidden:true,
            sortable:true,
            renderer: this.rendererFunction
        }, {
            header: this.localize.ValidationDate,
            dataIndex: 'AuthenticationPaymentDate',
            sortable:true,
            hidden:true,
            width:80,
            renderer: this.rendererDateFunction
        }, {
            header: this.localize.Storno,
            dataIndex: 'Storno',
            sortable:true,
            hidden:true,
            renderer: this.rendererFunction
        }, {
            header: this.localize.BatchNumber,
            dataIndex: 'RunNumber',
            sortable:true,
            hidden:true,
            renderer: this.rendererFunction
        }, {
            header: this.localize.PaymentDate,
            dataIndex: 'ExpectedPaymentDate',
            sortable:true,
            width:80,
            renderer: this.rendererDateFunction
        }, {
            header: this.localize.DivisionResponsible,
            dataIndex: 'ProcurementOrganization',
            sortable:true,
            renderer: function (value, metaData, record, rowIndex, colIndex, store) {
                if(value){
                    metaData.attr = 'title="'+value.DivisionSupervisorName+'"';
                    return value.DivisionSupervisorName;
                }
                else{
                    return '';
                }
            }
        }, {
            header: this.localize.InvoiceResponsible,
            dataIndex: 'InvoiceSupervisor',
            sortable:true,
            renderer: function (value, metaData, record, rowIndex, colIndex, store) {
                if(value){
                    metaData.attr = 'title="'+value.Name+'"';
                    return value.Name;
                }
                else{
                    return '';
                }
            }
        }, {
            header: this.localize.AccountsDepartment,
            dataIndex: 'AccountingDepartment',
            sortable:true,
            renderer: function (value, metaData, record, rowIndex, colIndex, store) {
                if(value){
                    metaData.attr = 'title="'+value.Name+'"';
                    return value.Name;
                }
                else{
                    return '';
                }
            }
        }, {
            header: this.localize.Archive,
            dataIndex: 'Archive',
            hidden:true,
            sortable:true,
            renderer: this.rendererFunction
        }, {
            header: this.localize.AddedDocument,
            dataIndex: 'HasAttachment',
            sortable:true,
            hidden:true,
            renderer: this.rendererFunction
        }
      ]
    }, config); //eo config apply

0 个答案:

没有答案