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);
}
}
这是我的网格配置:
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