Extjs floating Panel 挡住 提示框或确认框的解决方法
在弹窗代码的后面紧跟一句：
Ext.MessageBox.getDialog().getEl().setStyle('z-index', '80000');
即可。
如：
Ext.Msg.alert('提示', '根节点不能删除！');
Ext.MessageBox.getDialog().getEl().setStyle('z-index', '80000');
Ext.MessageBox.confirm("删除确认", '删除前将保存部门树组织结构，是否要保存部门树并删除"' + node.text + '" 及其下子部门？', function(button, text) {
if (button == "yes") {
}
});
Ext.MessageBox.getDialog().getEl().setStyle('z-index', '80000');
上面的方案很繁琐，每一个弹出对象都要设置一次 z-index ，
另一种解决方案是把panel的 floating 属性去掉，保留draggable，panel建好后设置position样式， 这样就不会出现漂浮面板遮挡弹出窗的问题。如：
var p = new Ext.Panel({
title: '菜单管理',
x: 5,
y: 5,
renderTo: Ext.getBody(),
//floating: true,
frame: true,
width: 400,
height: 500,
//autoHeight: true,
buttonAlign: 'center',
layout: 'fit',
draggable: {
insertProxy: false,
onDrag: function(e) {
var pel = this.proxy.getEl();
this.x = pel.getLeft(true);
this.y = 5; //pel.getTop(true); //仅移动X轴
var s = this.panel.getEl().shadow; //移动阴影
if (s) {
s.realign(this.x, this.y, pel.getWidth(), pel.getHeight());
}
},
endDrag: function(e) {
this.panel.setPosition(this.x, this.y);
}
},
buttons: [{
text: '保存',
handler: function() {
var data = new MenuInfo();
createMenuInfo(menutree.root, data);
Ext.Ajax.request({
url: 'MenuAction.ashx',
method: 'post',
params: {
action: 'save',
data: data.data
},
success: function(response, opts) {
if (response.responseText == '1') {
Ext.Msg.alert('提示', "保存成功！");
menutree.root.reload();
menutree.expandAll();
} else {
Ext.Msg.alert('提示', "保存失败！");
}
},
failure: function() { Ext.Msg.alert('提示', "保存失败！"); }
});
}
}, {
text: '刷新',
handler: function() {
menutree.root.reload();
menutree.expandAll();
}
}],
html: "<div id='div_menuTree'></div>"
});
//设置为绝对位置，使面板能漂移
p.getEl().setStyle('position', 'absolute');