解题思路1 ： 重载Connection类
由于extjs和server端交互全都是 json格式的数据交互，server端不会控制页面的跳转，页面跳转，提示功能全都有extjs来完成。
extjs和server端的交互方法全都是继承自 Ext.data.Connection,这个类中可以拦截所有和server端交互的方法。
server端的权限控制用acegi做的，如果没通过acegi的验证，没有授权会返回到403.jsp,需要重登录会返回到 login.jsp。
因此重载Connection类，并改写其中的 handleResponse 方法，判断返回的结果是否是 403.jsp,login.jsp, 如果是就进行相应的控制，如果是正常的返回数据就继续向下执行。
我个人在403.jsp 和login.jsp 的第一行加上了 注释代码<!--权限控制自定义关键字-->,就是靠这个关键字来工作的
，代码如下：
复制代码 代码如下:
//此处重载了Cunnection方法,用来拦截client与Server的交 互，
//后台acegi拦截用户请求后,如果无权限，返回403.jsp;如果没登录，返回login.jsp;
//通过Acegi拦截 后,才返回用户想要的Json结果
Ext.override(Ext.data.Connection, {
handleResponse : Ext.data.Connection.prototype.handleResponse.createInterceptor(
function(response) {
var resText=response.responseText;
if (resText.length>10) {
resText=resText.substr(0,9);
}
if (resText=='<!--login'){
window.top.location.href = topURL+"/login.jsp";
} else if (resText=='<!--deny-'){
if (resText=='<!--deny-'){
Ext.Msg.show({
title : '错误提示',
msg : '禁止访问此功能,请和系统管理员联系',
buttons : Ext.Msg.OK,
icon : Ext.Msg.INFO
});
};
} else if (resText=='<!--404--'){
Ext.Msg.show({
title : '错误提示',
msg : '页面未找到',
buttons : Ext.Msg.OK,
icon : Ext.Msg.INFO
});
}
})
});
解题思路2： server端返回菜单json数据
我的菜单用tree来做的，在初始化主页面时先初始化菜单，
复制代码 代码如下:
loader : new Ext.tree.TreeLoader({
dataUrl : 'getJsonMenus.do'
}),
这个'getJsonMenus.do'返回菜单json数据，在strut2中的配置为：
<action method="getJsonMenus">
<result type="json">
<param>menus</param>
</result>
</action>
menus是个list<JsonMenu>,
JsonMenu的属性为：
private String text;
private boolean expanded;
private String id;
private boolean leaf;
private List<JsonMenu> children;
getJsonMenus.do 返回的格式是可以满足tree的格式要求的。
js代码如下
复制代码 代码如下:
Ext.onReady(function() {
setTimeout(function() {
Ext.get('loading').remove();
Ext.getDom('header').style.visibility = 'visible';
var vp = new Ext.Viewport({
layout : 'border',
defaults : {
collapsible : true,
split : true
},
items : [{
xtype : 'box',
region : 'north',
applyTo : 'header',
height : 30,
split : false
}, {
title : currentUser,
id : 'accordion-panel',
layout : 'border',
region : 'west',
margins : '2 0 5 5',
width : 200,
minSize : 200,
maxSize : 250,
bodyStyle : 'background-color:#DFE8F6',
defaults : {
border : false
},
bbar : [{
text : '开始',
iconCls : 'icon-plugin',
menu : new Ext.menu.Menu({
items : [{
text : '关于系统',
iconCls : 'icon-info',
handler : function() {
new Ext.Window({
closeAction : 'close',
resizable : false,
bodyStyle : 'padding: 7',
modal : true,
title : '关于本系统',
html : '本系统采用目前较为流行的技术实现,<br>前台使用了ExtJs技术,所以实现了跨浏览器<br>' +
' 本程序在IE6,IE7,FireFox3均测试通过!<br><br>主要技术: Struts2 + Spring + iBatis + ExtJs<br><br>'
+ '数 据 库: Oracle 9i',
width : 300,
height : 200
}).show();
}
}, {
text : '退出系统',
iconCls : 'icon-delete',
handler : function() {
Ext.Msg.confirm('操作提示', '您确定要退出本系统?', function(btn) {
if ('yes' == btn) {
Ext.Ajax.request({
url : 'logout.do',
success : function() {
location = 'https://www.jb51.net/';
},
failure : function() {
Ext.Msg.show({
title : '错误提示',
msg : '退出系统失败!',
icon : Ext.Msg.ERROR,
buttons : Ext.Msg.OK
});
}
});
}
});
}
}]
})
}],
items : [{
layout : 'accordion',
region : 'center',
items : [{
title : '导航菜单',
iconCls : 'icon-nav',
border : false,
items : [{
xtype : 'treepanel',
border : false,
rootVisible : false,
autoScroll : true,
loader : new Ext.tree.TreeLoader({
dataUrl : 'getJsonMenus.do'
}),
root : new Ext.tree.AsyncTreeNode(),
listeners : {
'click' : function(n) {
try {
var sn = this.selModel.selNode || {};
if (n.leaf && n.id != sn.id) {
Ext.getCmp('content-panel').layout.setActiveItem(n.id.substring(0, n.id
.indexOf('-'))
+ '-panel');
}
} catch (e) {
}
}
}
}]
},{
title : '系统设置',
iconCls : 'icon-nav'
}]
}]
}, {
id : 'content-panel',
region : 'center',
layout : 'card',
margins : '2 5 5 0',
activeItem : 0,
border : false,
items : [start, p_company, p_user, p_dept, p_system, p_subject, p_category, p_resource]
}]
});
}, 250);
});
这样就得到了菜单，还有网友提出了异步菜单解决方法，我也把它列到下面
解题思路3 ： 同步加载所有的TAG,用hidden属性控制显示
所有的tag必须要同步加载后才可以控制component的hidden属性，异步加载不好用。
同步加载的方法如下：
复制代码 代码如下: