ExtJs5 -Ext.View.View 隐藏在 Ext 网格下方,仅在刷新后重新出现
ExtJs5 -Ext.View.View gets hidden beneath the Ext grid and only reappears after a refresh
我有一个使用 ExtJs5 呈现的页面。它有一个由 xtype:Container
、
组成的选项卡面板
this.tabPanel = Ext.create('Ext.tab.Panel', {
cls: 'tabPanel',
width: '100%',
minHeight: 400,
activeTab: 0,
items: [
{
title: 'Details',
items: [
this.detailsPanel
]
},
{
title: 'History',
items: [
{
xtype: 'container',
layout: {
type: 'vbox',
align: 'stretch'
},
items: [
this.collectionHistoryTitle,
collectionHistoryChart,
this.horizontalLineTop,
this.collectionHistoryPanelView,
this.horizontalLineBottomMargin,
this.collectionHistoryGrid,
//this.collectionLogPaging,
]
},
this.collectionHistoryDoNotChangeMessage
]
这里this.collectionHistoryPanelView,如下,
this.collectionHistoryPanelView = Ext.create('Ext.view.View', {
store: 'collectionHistoryPanelStore',
tpl: this.collectionHistoryPanelTpl,
emptyText: 'Please select a row.',
loadMask: false,
margin: '0 0 10 0'
});
发生的事情是,当我单击网格行 (this.collectionHistoryGrid
) 时,空文本 ('Please select a row') 被 html 模板 (this.collectionHistoryPanelTpl
) 替换,隐藏在网格后面并在刷新后正确显示。我已经尝试了很多东西,但到目前为止没有任何效果。
单击网格后,Ext 视图被隐藏:
刷新后有效:
@ardabeyazoglu 的评论给出了继续前进的正确道路。我们将 Ext 视图更改为容器,并将 html 模板作为 itemTpl,一切正常。
this.collectionHistoryPanelView = Ext.create('Ext.container.Container', {
margin: '0 0 10 0',
items : [
{
xtype: 'dataview',
itemTpl: this.collectionHistoryPanelTpl,
store: 'collectionHistoryPanelStore',
}
],
});
我有一个使用 ExtJs5 呈现的页面。它有一个由 xtype:Container
、
this.tabPanel = Ext.create('Ext.tab.Panel', {
cls: 'tabPanel',
width: '100%',
minHeight: 400,
activeTab: 0,
items: [
{
title: 'Details',
items: [
this.detailsPanel
]
},
{
title: 'History',
items: [
{
xtype: 'container',
layout: {
type: 'vbox',
align: 'stretch'
},
items: [
this.collectionHistoryTitle,
collectionHistoryChart,
this.horizontalLineTop,
this.collectionHistoryPanelView,
this.horizontalLineBottomMargin,
this.collectionHistoryGrid,
//this.collectionLogPaging,
]
},
this.collectionHistoryDoNotChangeMessage
]
这里this.collectionHistoryPanelView,如下,
this.collectionHistoryPanelView = Ext.create('Ext.view.View', {
store: 'collectionHistoryPanelStore',
tpl: this.collectionHistoryPanelTpl,
emptyText: 'Please select a row.',
loadMask: false,
margin: '0 0 10 0'
});
发生的事情是,当我单击网格行 (this.collectionHistoryGrid
) 时,空文本 ('Please select a row') 被 html 模板 (this.collectionHistoryPanelTpl
) 替换,隐藏在网格后面并在刷新后正确显示。我已经尝试了很多东西,但到目前为止没有任何效果。
单击网格后,Ext 视图被隐藏:
刷新后有效:
@ardabeyazoglu 的评论给出了继续前进的正确道路。我们将 Ext 视图更改为容器,并将 html 模板作为 itemTpl,一切正常。
this.collectionHistoryPanelView = Ext.create('Ext.container.Container', {
margin: '0 0 10 0',
items : [
{
xtype: 'dataview',
itemTpl: this.collectionHistoryPanelTpl,
store: 'collectionHistoryPanelStore',
}
],
});