API Docs for: 1.0.0
Show:

nablarch.ui.TreeMenu Class

階層表示メニュー(開閉可能)

このウィジェットは、開閉可能な階層表示機能を提供する。

マークアップ仕様

階層を持つメニューリストの領域を囲む要素に nablarch_TreeMenu を指定し、 -name にメニュー用のformの名前を設定する(リクエストを跨いだ開閉状態の維持のため)

開閉を行うタイトルとなる要素には menu_title を指定し、id属性に一意の値を設定する。 id属性の値は後述するフォルダー用の要素を紐付けるために指定が必須である。

メニューのリンク要素などを固めるフォルダー用の要素には menu_folder を指定する。 前述したタイトル用のid属性の値を-title の直後に指定することでタイトルとの紐付けが可能となる。

menu_folder でない menu_titleの開閉状態は最上位のtitleして常に表示されるが、 最上位のtitleの開閉が変更された場合、他の最上位タイトルは閉じる。

1つの要素にタイトルの機能とフォルダの機能を持たせることが可能である。 以下に階層させた場合のマークアップを示す。

<h3 id="title">menu</h3>
<ul class="menu_folder -title title" >
  <li><a href="./user_menu.html">user</a></li>
</ul>
<h3 id="sub_title" class="menu_folder -title title">user_links</h3> <!-- #title をクリックすることでこのフォルダが開閉する -->
<ul class="menu_folder -title sub_title">
  <li><a href="./user_list.html">user_list</a></li>
  <li><a href="./update_user.html">update_user</a></li>

......
</ul>

Item Index

Properties

Methods

render

()

フォーム要素に保持した開閉状態を表示に反映させる。

toggle

()

最上位のタイトルの開閉を行うメソッド。

TreeMenu

(
  • element
  • [opts]
)

コンストラクタ関数。

Parameters:

  • element HTMLElement

    メニューの領域

  • [opts] Object optional

    以下のオプションを保持するオブジェクト name: (String) メニュー領域があるformのname属性

Properties

$folders

JQuery

開閉されるメニューを持つ要素。

$titles

JQuery

開閉するタイトルの要素。

$tops

Unknown

必ず表示されるメニューの最上位階層。

name

String

開閉状態を保存するためのformの名前。