0
我在頁面中有2個網格和1個面板。
最初，網格可見並且面板隱藏。無法隱藏extjs面板
firstGrid.hide();
secondGrid.hide();
firstPanel.show();
節省了面板上的記錄後，我要隱藏面板，並啓用網格，這是我嘗試使用此：
上的一個按鈕的點擊我使用使面板和隱藏2個格firstGrid.show();
secondGrid.show();
alert(firstPanel); //<-- firstPanel is not defined (error console)
firstPanel.hide();
因此，所有3個（2個網格和1個面板）都是可見的，這是不期望的。我想隱藏面板。
任何人都可以通過指出錯誤來教育我嗎？
面板佈局：
var firstPanel = Ext.create('Ext.panel.Panel', {
title: '<center>First Panel</center>',
margin:'20 0 0 0',
autoHeight: true,
width:780,
standardSubmit:false,
store: storeName,
hidden:true,
frame: true,
layout: {
type: 'table',
columns: 4
}, defaults: {
// applied to each contained panel
bodyStyle: 'background-color:#dfe8f5;'
},
items: [
{
xtype:'textfield',width:120,height:31,colspan:1,readOnly:true,margin: '0 0 0 0',
fieldStyle: 'background-color: #dfe8f5; background-image: none; border: none; font-weight: bold; color: #505050;',
value:'First Field'
},{
xtype:'textfield',id:'usap1',width:199, height:26,colspan:1,readOnly:true,margin: '1 0 1 0', dataIndex: 'firstVar',
fieldStyle: 'background-color: #dfe8f5; background-image: none; text-align: center;border: none; font-weight: bold; color: #505050;'
},{
xtype:'textfield',width:100,height:31,colspan:1,readOnly:true,margin: '0 0 0 20',
fieldStyle: 'background-color: #dfe8f5; background-image: none; border: none; font-weight: bold; color: #505050;',
value:'Second Field'
},{
xtype:'textfield',id:'usap2',width:199,height:26,colspan:1,margin: '1 0 1 0',readOnly:true, dataIndex: 'secondVar',
fieldStyle: 'background-color: #dfe8f5; background-image: none; text-align: center;border: none; font-weight: bold; color: #505050;'
},{
xtype:'textfield',width:100,height:31,colspan:1,margin: '0 0 0 0',readOnly:true,
fieldStyle: 'background-color: #dfe8f5; background-image: none; border: none; font-weight: bold; color: #505050;',
value:'Third Field'
},{
xtype: 'datefield', id : 'usap3', anchor: '100%', name: 'stockAsOn', format: 'd/m/Y', width: 199, altFormats: 'd-M-y',
fieldStyle: 'text-align: center;', height: 26
},{
xtype:'textfield',width:100,height:31,colspan:1,readOnly:true,margin: '0 0 0 20',
fieldStyle: 'background-color: #dfe8f5; background-image: none; border: none; font-weight: bold; color: #505050;',
value:'Fourth Field'
},{
xtype:'textfield',id:'usap4',width:199,height:26,colspan:1,margin: '1 0 1 0',
fieldStyle: 'text-align: center;'
},{
xtype:'textfield',width:100,height:31,colspan:1,readOnly:true,margin: '0 0 0 0',
fieldStyle: 'background-color: #dfe8f5; background-image: none; border: none; font-weight: bold; color: #505050;',
value:'Fifth Field'
},{
xtype:'textfield',id:'usap5',width:199,height:26,colspan:1,margin: '1 0 1 0',
fieldStyle: 'text-align: center;'
},{
xtype:'textfield',width:100,height:31,colspan:1,readOnly:true,margin: '0 0 0 20',
fieldStyle: 'background-color: #dfe8f5; background-image: none; border: none; font-weight: bold; color: #505050;',
value:'Sixth Field'
},{
xtype:'textfield',id:'usap6',width:199,height:26,colspan:1,margin: '1 0 1 0',
fieldStyle: 'text-align: center;'
},{
xtype:'textfield',width:100,height:31,colspan:1,readOnly:true,margin: '0 0 0 0',
fieldStyle: 'background-color: #dfe8f5; background-image: none; border: none; font-weight: bold; color: #505050;',
value:'Seventh Field'
},{
xtype:'textfield',id:'usap7',width:199,height:26,colspan:1,margin: '1 0 1 0',
fieldStyle: 'text-align: center;'
},{
xtype:'textfield',width:151,height:31,colspan:1,readOnly:true,margin: '0 0 0 20',
fieldStyle: 'background-color: #dfe8f5; background-image: none; border: none; font-weight: bold; color: #505050;',
value:'Eigth Field'
},{
xtype:'textfield',id:'usap8',width:199,height:26,colspan:1,margin: '1 0 1 0',
fieldStyle: 'text-align: center;'
},{
xtype:'textfield',width:151,height:31,colspan:1,readOnly:true,margin: '0 0 0 0',
fieldStyle: 'background-color: #dfe8f5; background-image: none; border: none; font-weight: bold; color: #505050;',
value:'Ninth Field'
},{
xtype:'textfield',id:'usap9',width:199,height:26,colspan:1,margin: '1 0 1 0',
fieldStyle: 'text-align: center;'
},{
xtype:'textfield',width:151,height:31,colspan:1,readOnly:true,margin: '0 0 0 20',
fieldStyle: 'background-color: #dfe8f5; background-image: none; border: none; font-weight: bold; color: #505050;',
value:'tenth Field'
},{
xtype:'textfield',id:'usap10',width:199,height:26,colspan:1,margin: '1 0 1 0',
fieldStyle: 'text-align: center;'
},{
xtype:'textfield',width:151,height:31,colspan:1,readOnly:true,margin: '0 0 0 0',
fieldStyle: 'background-color: #dfe8f5; background-image: none; border: none; font-weight: bold; color: #505050;',
value:'Eleventh Field'
},{
xtype:'textfield',id:'usap11',width:199,height:26,colspan:1,margin: '1 0 1 0',
fieldStyle: 'text-align: center;'
},{
html:'',
border:false
}],
buttons: [{
xtype: 'checkbox', id:'usapCheck', boxLabel: 'I Accept', allowBlank: false, margin: '1 1 4 230'
},{
buttonAlign: 'right',margin:'0 0 0 3.6',text: 'Save',width: '30',iconCls: 'save',
handler: function() {
if(Ext.getCmp('usapCheck').getValue()){
saveMethod();
}else{
Ext.MessageBox.alert('Please accept before saving the form');
}
}
},{
buttonAlign: 'right',margin:'1 1 0 3.6',text: 'Clear',width: '30',iconCls: 'clear',
handler: function() {
clearfirstPanel();
}
},{
buttonAlign: 'right',margin:'1 1 1 1.6',text: 'Back',width: '30',iconCls: 'back',
handler: function() {
firstGrid.show();
secondGrid.show();
firstPanel.hide(); //this part is working fine. Here it gets hidden
}
}],
renderTo: 'panelDiv'
});
function saveMethod(){.....
---AjaxCall----
if(jsonTxt.sucFlg==1){
Ext.MessageBox.alert('Record Saved Successfully');
firstGrid.show();
secondGrid.show();
firstPanel.hide();
}.....
}
請發表您的佈局代碼 – 2014-10-20 13:06:52
@DarinKolev整個頁面的佈局非常龐大。所以我剛剛發佈了面板部分和方法來隱藏它。 – Freakyuser 2014-10-20 13:46:47
更重要的是包含所有網格和麪板的父容器的佈局。面板的佈局並不重要 – 2014-10-20 13:54:25