OAF學習筆記-22-多層菜單的製作

思路:利用系統中的HGrid 控件從數據庫中將菜單抓出來父菜單的id 作爲區別子菜單

做兩個VO 一個VO是父菜單另一個VO 是子菜單

SOBVO(父菜單)


自己增加一列 selectflag 作爲勾選的一列

OUVO(子菜單)


set_of_books_id 作爲父菜單辨別(分類)

建VL(view link 聯繫兩個VO 配兩個的關係)


Select Source Attribute 作爲父id   Select Destination Attribute 作爲子id

新建AM (有AM 直接添加進去就行了)


將兩個VO增加進去,

做頁面中的HGrid


新建Region 將style 改成HGrid


新建Tree


Tree來做出層次結構


nodeDef 顯示, chileNode 將兩個node聯繫起來



這裏是OUVO,不是其他的VO 其他的則不顯示子菜單

子菜單



:Ancestor Node 如果在PageLayout下就直接頁面.Region 如果中間還有Region 則是頁面.Region1.Region2.

顯示



此時的ALL 不會顯示爲ALL 是顯示ROOT NODE 這需要在CO 中進行修改


獲取HGrid 將RootNode 修改在 CO中的processRequest修改勾選框有兩種做法,一種是用HGrid 提供的multipleSelection 




顯示效果爲:


HGrid 中的多選框 ,不能設置ActionType,   兩種方法進行操作,第一種較爲簡單,單獨做一個Checkbox的域,可以設置ActionType 直接傳參(缺點不能將位置調到之前Hgrid 生成的多選框的位置,只能在在Hgrid 之後添加) 第二種較爲繁瑣,利用js 在加載時將Hgrid的的多選框上添加函數事件.

第一種:





用兩個checkbox的原因是使用一個,HGrid 會自動讓它變成multipleSelection 就算寫了Action Type 都沒有用所以建兩個Checkbox  VO 對應 父類菜單的VO (對應子類VO,不能下拉菜單 )

讓第一個CheckBox不顯示(兩種方法)

第一種

在CO中的processRequest進行設置


第二種


Rendered 設置爲false 就可以了

 

隱藏select 成功

 

設置Action


提交進來後對其進行處理


獲取父類所有菜單,獲取記錄,

勾選出發後,判斷是ALL 觸發的(由於ALL 沒有對應VO中的數據 ,所以判斷觸發,由系統頁面分配的HTML 元素判斷 , 由於ALL是RootNode 始終處於第一個元素,所以元素id不變)



判斷確定是ALL觸發後則將所有的菜單中的selectflag 設爲Y 則就等於將所有的勾選框進新了勾選

ALL取消勾選(在ALL觸發時遍歷所有的勾選框進行判斷,如果是全部選中則將所有置爲否)



遍歷所有菜單,如果有一個未被勾選,可以確定要求爲全部選中,反之是要求全部取消選中;確定需求後,直接再一次遍歷根據需求將值設置.

在checkbox 中Action  設置Parameters


如果是父菜單,sob這個參數則會有值, 如果是子菜單則沒有


判斷如果是父類菜單觸發的 遍歷所有父類菜單,被勾選上的,將其子VO中的selectflag 設爲Y,如果沒有勾選的將其子VO中的selectflag 設爲 N (實現的功能是勾選父菜單,子菜單全部勾選,取消勾選父菜單,子菜單全部取消勾選) 



判斷爲子菜單觸發的話,獲取當前VO的下標我這裏使用的是系統參數evtSrcRowId ,參數是一串字符串用下劃線分隔開的,最後一個數據是則是下標值,也可以通過系統函數獲取當前VO的Index.獲取後,找到該下標的SOB 遍歷其子VO中的勾選情況,如果有一個爲未勾選,則整個狀態爲false (採用與運算) 反之全部勾選則爲true ,爲true 將該SOB的selectfalg設爲Y 否則爲N.(實現的功能是全選父菜單的子菜單,父菜單勾選,父菜單中的任意子菜單沒有勾選,取消勾選父菜單)


第二種:

思路:通過js 獲取到觸發的控件,再在控件上寫函數提交到CO中並將頁面上的數據當作參數,傳到CO中根據傳過來的值,進行setSelectflag,

JS 函數(一)



這個函數用過獲取觸發js 的控件,並且判斷是否是勾選框或者是否是全選或者全否選,如果是就將需要的參數獲取,submit form.

JS 函數(二)



這個函數是鼠標移動上時將全選和全否選的href置爲#, 在設置時設置爲onmouseover 如果設置onclick 則將先進href 後再將值置爲#,原來的href 爲系統生成的js函數,只是將頁面上顯示出來的全部勾選或者否選.用函數將其置爲#,後用上一函數,改爲點擊進入CO. 


OAF中使用js 是在CO中的processRequest 用String將function 拼接,用     pageContext.putJavaScriptFunction 將js 加進到js庫中,再在觸發區域使用setOnClick;


同理將此函數與觸發區域綁定,但是使用setOnMouseOver;

將系統生成的js 函數 submit拿過來用有幾點需要注意;

submitForm('DefaultFormName',1,{'evtSrcRowIdx':'','sob':'','evtSrcRowId':'',event:'Test1',source:'Checkbox','sobt':'','out':v,'check':flag});returntrue;

這個js函數主要是中間幾個系統的參數,可以選擇不修改,也可以刪除,但是參數名不能刪除

自己需要傳參可以在後面添加,我添加了sobt,out和check 這三個參數在 CO中的processFormRequest 中直接使用Stringsobt=pageContext.getRawParameter("sobt").trim();獲取,會有空行,所以使用trim()去掉前後空格

setSelectflag 過程與上一方法類似,不進行再次貼圖.

 

:在過程中遇到使用部分VOImpl VORowImpl (不知道是什麼原因導致) 會報類型轉化錯誤此時可以直接使用am. findViewObject 返回VO的父類對象ViewObject 則可以正常使用後期解決,在此修改

注:js在不同的瀏覽器中兼容性的問題需要考慮,貼圖只是IE的


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章