====== 트리메뉴 메인메뉴 서브메뉴 가이드 ====== 이 화면은 하나의 데이터셋을 2개의 트리메뉴에 연결하고, 메인메뉴와 서브메뉴로 표시하는 샘플 화면이다. 메인메뉴용 트리메뉴에서는 display_depth속성으로 표시할 깊이를 지정한다. 서브메뉴용 트리메뉴에는 item_display_mode속성을 1:api로 지정하여 초기기동시 메뉴를 표시하지 않도록 한다. 메인메뉴의 on_itemclick이벤트에서 서브메뉴의 setrootrowindex API를 호출하여 서브메뉴에 표시할 메뉴를 지정한다. ===== 예시 ===== 템플릿 위치: /HTML5/COMPONENT/TREEMENU/treemenu_main_sub 템플릿 파일 * [[xf5projecthome>template/screen/HTML5/COMPONENT/TREEMENU/treemenu_main_sub.xml|treemenu_main_sub.xml]] * [[xf5projecthome>template/screen/HTML5/COMPONENT/TREEMENU/treemenu_main_sub.js|treemenu_main_sub.js]] * [[xf5projecthome>template/template.html?xframe_screen_url=/HTML5/COMPONENT/TREEMENU/treemenu_main_sub|새창으로 실행]] echo ''; echo ''; echo ''; ==== 화면 스크립트 ==== function treemenu_main_on_itemclick(objInst, index, depth, type) { // 메인메뉴에서 선택된 아이템의 인덱스로부터 데이터셋의 행 인덱스를 취득 var row_index = treemenu_main.getitemrowindex(index); if (depth == 1 && row_index >= 0) { // 서브메뉴에서 루트가 될 데이터셋 행 인덱스를 지정한다. treemenu_sub.setrootrowindex(row_index); // item_display_mode가 1:api인 경우, refresh API를 호출해야 화면에 메뉴정보가 표시된다. treemenu_sub.refresh(); } }