欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

extjs 的權(quán)限問題 要求控制的對(duì)象是 菜單，按鈕，URL

 更新時(shí)間：2010年03月09日 20:32:03   作者：  
這兩天在解決extjs 的權(quán)限問題。要求控制的對(duì)象是 菜單，按鈕，URL

解題思路1 ： 重載Connection類
由于extjs和server端交互全都是 json格式的數(shù)據(jù)交互，server端不會(huì)控制頁面的跳轉(zhuǎn)，頁面跳轉(zhuǎn)，提示功能全都有extjs來完成。
extjs和server端的交互方法全都是繼承自 Ext.data.Connection,這個(gè)類中可以攔截所有和server端交互的方法。
server端的權(quán)限控制用acegi做的，如果沒通過acegi的驗(yàn)證，沒有授權(quán)會(huì)返回到403.jsp,需要重登錄會(huì)返回到 login.jsp。
因此重載Connection類，并改寫其中的 handleResponse 方法，判斷返回的結(jié)果是否是 403.jsp,login.jsp, 如果是就進(jìn)行相應(yīng)的控制，如果是正常的返回?cái)?shù)據(jù)就繼續(xù)向下執(zhí)行。
我個(gè)人在403.jsp 和login.jsp 的第一行加上了 注釋代碼<!--權(quán)限控制自定義關(guān)鍵字-->,就是靠這個(gè)關(guān)鍵字來工作的
，代碼如下：

復(fù)制代碼 代碼如下:

//此處重載了Cunnection方法,用來攔截client與Server的交 互，
//后臺(tái)acegi攔截用戶請(qǐng)求后,如果無權(quán)限，返回403.jsp;如果沒登錄，返回login.jsp;
//通過Acegi攔截 后,才返回用戶想要的Json結(jié)果
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 : '錯(cuò)誤提示',
msg : '禁止訪問此功能,請(qǐng)和系統(tǒng)管理員聯(lián)系',
buttons : Ext.Msg.OK,
icon : Ext.Msg.INFO
});
};
} else if (resText=='<!--404--'){
Ext.Msg.show({
title : '錯(cuò)誤提示',
msg : '頁面未找到',
buttons : Ext.Msg.OK,
icon : Ext.Msg.INFO
});
}
})
});

解題思路2： server端返回菜單json數(shù)據(jù)
我的菜單用tree來做的，在初始化主頁面時(shí)先初始化菜單，
復(fù)制代碼 代碼如下:

loader : new Ext.tree.TreeLoader({
dataUrl : 'getJsonMenus.do'
}),
這個(gè)'getJsonMenus.do'返回菜單json數(shù)據(jù)，在strut2中的配置為：
<action name="getJsonMenus" class="jsonSystemAction" method="getJsonMenus">
<result type="json">
<param name="root">menus</param>
</result>
</action>

menus是個(gè)list<JsonMenu>,
JsonMenu的屬性為：
private String text;
private boolean expanded;
private String id;
private boolean leaf;
private List<JsonMenu> children;
getJsonMenus.do 返回的格式是可以滿足tree的格式要求的。
js代碼如下
復(fù)制代碼 代碼如下:

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 : '關(guān)于系統(tǒng)',
iconCls : 'icon-info',
handler : function() {
new Ext.Window({
closeAction : 'close',
resizable : false,
bodyStyle : 'padding: 7',
modal : true,
title : '關(guān)于本系統(tǒng)',
html : '本系統(tǒng)采用目前較為流行的技術(shù)實(shí)現(xiàn),<br>前臺(tái)使用了ExtJs技術(shù),所以實(shí)現(xiàn)了跨瀏覽器<br>' +
' 本程序在IE6,IE7,FireFox3均測(cè)試通過!<br><br>主要技術(shù): Struts2 + Spring + iBatis + ExtJs<br><br>'
+ '數(shù)&nbsp;&nbsp;據(jù)&nbsp;&nbsp;庫: Oracle 9i',
width : 300,
height : 200
}).show();
}
}, {
text : '退出系統(tǒng)',
iconCls : 'icon-delete',
handler : function() {
Ext.Msg.confirm('操作提示', '您確定要退出本系統(tǒng)?', function(btn) {
if ('yes' == btn) {
Ext.Ajax.request({
url : 'logout.do',
success : function() {
location = '/';
},
failure : function() {
Ext.Msg.show({
title : '錯(cuò)誤提示',
msg : '退出系統(tǒng)失敗!',
icon : Ext.Msg.ERROR,
buttons : Ext.Msg.OK
});
}
});
}
});
}
}]
})
}],
items : [{
layout : 'accordion',
region : 'center',
items : [{
title : '導(dǎo)航菜單',
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 : '系統(tǒng)設(shè)置',
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);
});

這樣就得到了菜單，還有網(wǎng)友提出了異步菜單解決方法，我也把它列到下面
解題思路3 ： 同步加載所有的TAG,用hidden屬性控制顯示
所有的tag必須要同步加載后才可以控制component的hidden屬性，異步加載不好用。
同步加載的方法如下：
復(fù)制代碼 代碼如下:

//FUTURE_TAG全局的TAG控制類, 控制的組件的hidden屬性,key=TAG的名字,value=true(組件隱藏),false(組件顯示)
var FUTURE_TAG={tbar1: false, tbar2: true};
var conn = Ext.lib.Ajax.getConnectionObject().conn;
conn.open("GET", 'getJsonTags.do',false);
conn.send(null);
future_tag= eval('(' + conn.responseText + ')');

在js中TAG的用法如下：
復(fù)制代碼 代碼如下:

var btn_add_system = new Ext.Button({
text : '添加',
iconCls : 'icon-add',
hidden: FUTURE_TAG.system_add,
handler : function() {
window_add_system.show();
}
});

getJsonTags.do 返回一個(gè)Map對(duì)象，key是TAG名字，value是boolean
java的寫法如下：
復(fù)制代碼 代碼如下:

tagMap=new HashMap<String,Boolean>();
for (int i=0;i<allTagList.size();i++){
tagMap.put(allTagList.get(i).getResString(), true);
}

strut2配置如下：
復(fù)制代碼 代碼如下:

<action name="getJsonTags" class="jsonSystemAction" method="getJsonTags">
<result type="json">
<param name="root">tagMap</param>
</result>
</action>

這樣就可以在后臺(tái)控制前臺(tái)的組件是否顯示了，從而達(dá)到了我們的目的。
解決思路4：
通過ajax讀取服務(wù)器端的權(quán)限值，返回這樣的數(shù)據(jù)：
{tbar1: false, tbar2: true}
然后在extjs中：
var vResult = eval('(' + ajaxText + ')'); //得到{tbar1: false, tbar2: true}
這樣就可以直接給tbar賦值了
disabled: vResult.tbar1
disabled: vResult.tbar2
解決思路5：
設(shè)置模塊權(quán)限用于設(shè)置用戶可以操作的權(quán)限。允許設(shè)置用戶對(duì)模塊的可操作與不可操作。
彈出設(shè)置權(quán)限子窗體
設(shè)置權(quán)限之前須選擇一個(gè)用戶。
Js代碼
復(fù)制代碼 代碼如下:

var row = grid_user.getSelectionModel().getSelected();
if(!row){
alert('對(duì)不起，您還未選擇數(shù)據(jù)!');
return;
}
var row = grid_user.getSelectionModel().getSelected();
if(!row){
alert('對(duì)不起，您還未選擇數(shù)據(jù)!');
return;
}

創(chuàng)建一棵樹，樹放置在彈出窗體的中央。
Js代碼
復(fù)制代碼 代碼如下:

var root=new Ext.tree.TreeNode({
id:"root",
text:"所有操作",
checked:false,
iconCls:'task-folder'
});
var tree=new Ext.tree.TreePanel({
frame:false,
region:'center',
root:root,
animate:true,
enableDD:false,
border:false,
rootVisible:true,
autoScroll:true
});
var root=new Ext.tree.TreeNode({
id:"root",
text:"所有操作",
checked:false,
iconCls:'task-folder' });
var tree=new Ext.tree.TreePanel({
frame:false,
region:'center',
root:root,
animate:true,
enableDD:false,
border:false,
rootVisible:true,
autoScroll:true
});

創(chuàng)建彈出子窗體。
Js代碼
復(fù)制代碼 代碼如下:

var win = new Ext.Window({
title:'設(shè)置模塊權(quán)限',
closable:true,
width:300,
height:500,
plain:true,
layout:'border',
modal:true,
items:[tree]
});
win.show(this);
var win = new Ext.Window({
title:'設(shè)置模塊權(quán)限',
closable:true,
width:300,
height:500,
plain:true,
layout:'border',
modal:true,
items:[tree]
});
win.show(this);

在加載數(shù)據(jù)期間，給予提示。
Js代碼
復(fù)制代碼 代碼如下:

Ext.MessageBox.show({
title:'請(qǐng)稍候',
msg:'正在加載數(shù)據(jù)，請(qǐng)耐心等待...',
progress:true
});
Ext.MessageBox.show({
title:'請(qǐng)稍候',
msg:'正在加載數(shù)據(jù)，請(qǐng)耐心等待...',
progress:true
});

將根節(jié)點(diǎn)，所選擇的用戶行，父節(jié)點(diǎn)標(biāo)志作為參數(shù)調(diào)用方法。
Js代碼
getNodes(row,root,'root');
getNodes(row,root,'root');
從后臺(tái)中取得數(shù)據(jù)并以樹形式在客戶端展現(xiàn)
方法定義與方法內(nèi)容。
Js代碼
復(fù)制代碼 代碼如下:

function getNodes(row,root,parent){
//...
}
function getNodes(row,root,parent){ //...}

JSON 數(shù)據(jù)的定義。
Js代碼
復(fù)制代碼 代碼如下:

var record_pri = new Ext.data.Record.create([
{name:'modelId'},
{name:'modelName'},
{name:'sort'},
{name:'canUse'},
{name:'privilegeId'}
]);
var store_pri = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({url:'../'}),
reader: new Ext.data.JsonReader({root:'rows'},record_pri)
});
var record_pri = new Ext.data.Record.create([
{name:'modelId'},
{name:'modelName'},
{name:'sort'},
{name:'canUse'},
{name:'privilegeId'}
]); var store_pri = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({url:'../'}),
reader: new Ext.data.JsonReader({root:'rows'},record_pri)
});

無刷新請(qǐng)求，獲取數(shù)據(jù)并展現(xiàn)出來；并添加事件監(jiān)聽。當(dāng)點(diǎn)擊樹某一節(jié)點(diǎn)時(shí)，判斷是否已經(jīng)從后臺(tái)取得數(shù)據(jù)，如果還沒有取則從后臺(tái)獲取數(shù)據(jù)，再根據(jù)返回的數(shù)據(jù)判斷是葉子節(jié)點(diǎn)還是非葉子節(jié)點(diǎn)。然后以不同的方式展現(xiàn)與處理。
葉子節(jié)點(diǎn)和非葉子節(jié)點(diǎn)展現(xiàn)時(shí)，使用的圖標(biāo)不同。葉子節(jié)點(diǎn)沒有添加單擊事件，而非葉子節(jié)點(diǎn)添加了單擊事件。
Js代碼
復(fù)制代碼 代碼如下:

Ext.Ajax.request({
url:'http://www.cnblogs.com/../privilegeAction.do?method=list',
params:{
userId:row.get('userId'),
parentId:parent
},
success:function(response, request){
Ext.MessageBox.hide();
var res = Ext.util.JSON.decode(response.responseText);
store_pri.loadData(res);
for(var i=0;i<store_pri.getCount();i++){
var rec = store_pri.getAt(i);
var canuse = (rec.get('canUse')=='是'?true:false);
var modid = rec.get('privilegeId') + '-id-' + rec.get('modelId');
var node;
if(rec.get('sort')=='菜單'){
node = new Ext.tree.TreeNode({
text:rec.get('modelName'),
id:modid,
checked:canuse,
iconCls:'task-folder'
});
node.on('click',function(node){
if(node.firstChild==null){
getNodes(row,node,get_mod_id(node.id));
}
});
} else {
node = new Ext.tree.TreeNode({
text:rec.get('modelName'),
id:modid,
checked:canuse,
iconCls:'task'
});
}
node.on('checkchange',function(node,check){
Ext.Ajax.request({
url:'http://www.cnblogs.com/../privilegeAction.do?method=save2',
params:{
privilegeId:get_rec_id(node.id),
canuse:(check?'是':'否')
},
success:function(response, request){

},
failure:function(){
Ext.MessageBox.hide();
alert('sorry!');
}
});
});
root.appendChild(node);
}
root.expand();
},
failure:function(){
Ext.MessageBox.hide();
alert('sorry!');
}
});
Ext.Ajax.request({
url:'http://www.cnblogs.com/../privilegeAction.do?method=list',
params:{
userId:row.get('userId'),
parentId:parent
},
success:function(response, request){
Ext.MessageBox.hide();
var res = Ext.util.JSON.decode(response.responseText);
store_pri.loadData(res);
for(var i=0;i<store_pri.getCount();i++){
var rec = store_pri.getAt(i);
var canuse = (rec.get('canUse')=='是'?true:false);
var modid = rec.get('privilegeId') + '-id-' + rec.get('modelId');
var node;
if(rec.get('sort')=='菜單'){
node = new Ext.tree.TreeNode({
text:rec.get('modelName'),
id:modid,
checked:canuse,
iconCls:'task-folder'
});
node.on('click',function(node){
if(node.firstChild==null){
getNodes(row,node,get_mod_id(node.id));
}
});
} else {
node = new Ext.tree.TreeNode({
text:rec.get('modelName'),
id:modid,
checked:canuse,
iconCls:'task'
});
}
node.on('checkchange',function(node,check){
Ext.Ajax.request({
url:'http://www.dbjr.com.cn/../privilegeAction.do?method=save2',
params:{
privilegeId:get_rec_id(node.id),
canuse:(check?'是':'否')
},
success:function(response, request){
},
failure:function(){
Ext.MessageBox.hide();
alert('sorry!');
}
});
});
root.appendChild(node);
}
root.expand();
},
failure:function(){
Ext.MessageBox.hide();
alert('sorry!');
} });

當(dāng)非葉子節(jié)點(diǎn)被點(diǎn)擊時(shí)，遞歸地調(diào)用方法來獲取孩子節(jié)點(diǎn)。
獲取行的ID和模塊的ID。樹的節(jié)點(diǎn)將行的ID和模塊的ID一起取出來了。不然的話，如果只取得模塊ID，而不取行ID，那么在修改的時(shí)候，則不能進(jìn)行正確的修改。
Js代碼
復(fù)制代碼 代碼如下:

function get_rec_id(str){
var arr = str.split('-id-');
return arr[0];
}
function get_mod_id(str){
var arr = str.split('-id-');
return arr[1];
}

相關(guān)文章

  • extjs DataReader、JsonReader、XmlReader的構(gòu)造方法

    extjs DataReader、JsonReader、XmlReader的構(gòu)造方法

    DataReader、JsonReader、XmlReader的構(gòu)造方法,需要的朋友可以參考下。
    2009-11-11
  • Extjs Ext.MessageBox.confirm 確認(rèn)對(duì)話框詳解

    Extjs Ext.MessageBox.confirm 確認(rèn)對(duì)話框詳解

    顯示一個(gè)確認(rèn)對(duì)話框，用來代替JavaScript標(biāo)準(zhǔn)的confirm()方法，具有兩個(gè)按鈕“是”和“否”如果為其提供一個(gè)回調(diào)函數(shù)，則該函數(shù)將在單擊按鈕后被調(diào)用(包括右上角的推出按鈕)，所單擊按鈕的id將被作為唯一的參數(shù)傳遞到回調(diào)函數(shù)中。
    2010-04-04
  • ext前臺(tái)接收action傳過來的json數(shù)據(jù)示例

    ext前臺(tái)接收action傳過來的json數(shù)據(jù)示例

    這篇文章以示例的方式為大家介紹了ext前臺(tái)接收action傳過來的json數(shù)據(jù),需要的朋友可以參考下
    2014-06-06
  • ExtJS4給Combobox設(shè)置列表中的默認(rèn)值示例

    ExtJS4給Combobox設(shè)置列表中的默認(rèn)值示例

    這篇文章主要介紹了ExtJS4如何給Combobox設(shè)置列表中的默認(rèn)值,需要的朋友可以參考下
    2014-05-05
  • 學(xué)習(xí)ExtJS Column布局

    學(xué)習(xí)ExtJS Column布局

    ExtJS Column布局使用說明，需要的朋友可以參考下。
    2009-10-10
  • extjs之去除s.gif的影響

    extjs之去除s.gif的影響

    其實(shí)這一個(gè)總是很容易解決，只要在Ext.onReady()方法之前（或者方法的第一句）加上下面這一句代碼就解決了！
    2010-12-12
  • ExtJS4中的requires使用方法示例介紹

    ExtJS4中的requires使用方法示例介紹

    ExtJS4的requires是新增的機(jī)制，主要是實(shí)現(xiàn)異步加載機(jī)制，在下面的文章總將為大家介紹下ExtJS4中的requires使用方法，需要的朋友不要錯(cuò)過
    2013-12-12
  • 將list轉(zhuǎn)換為json失敗的原因

    將list轉(zhuǎn)換為json失敗的原因

    如何用的hibernate的自動(dòng)注解，并且里面有一對(duì)多，多對(duì)一的關(guān)系，這是需要在不需要的字段上加上注解@JsonIgnore
    2013-12-12
  • JavaScript的ExtJS框架中表格的編寫教程

    JavaScript的ExtJS框架中表格的編寫教程

    ExtJS是一個(gè)MVVM結(jié)構(gòu)的JavaScript框架,在處理表格表單方面則是它的拿手好戲,這里整理了基本的JavaScript的ExtJS框架中表格的編寫教程
    2016-05-05
  • ExtJS Window 最小化的一種方法

    ExtJS Window 最小化的一種方法

    ExtJS 中Window的窗口最大化只需將maximizable屬性設(shè)置為true即可，點(diǎn)擊最大化按鈕就可以將窗體最大化，最小化的操作類似將minimizable設(shè)置為true，即可以看到窗體的最小化按鈕，但是點(diǎn)擊此按鈕并不會(huì)出發(fā)任何操作，Ext沒有為窗口預(yù)設(shè)最小化的任何操作，需要自己自定義最小化功能。
    2009-11-11

最新評(píng)論