Wiki Navigation

Top > 開発ガイド > コンポーネント開発Tips集 > Spinelzヘルパ > render_treeview

render_treeview

概要

Tree View用ヘルパーです。
Tree Viewを直接利用するより、高速に描画することができます。
ツリーはディレクトリ、ファイルから構成されます。（以下、2つまとめてアイテムと表記します。）

利用方法

Modelをツリーの要素として定義する

acts_as_spinelz_treeview(options)

オプション名	必須	概要
name	○	ツリーの要素として画面に表示される名前を取得するためのメソッドを指定します。
type	○	ツリー要素の種類を指定します。:directoryまたは:fileを指定します。
children	×	子要素の配列を取得するためのメソッドを指定します。子要素は全てツリー要素として定義されていなければなりません。typeが:directoryのときのみ有効です。
id	×	アイテムのIDを取得するためのメソッドを指定します。指定しない場合、idメソッドが利用されます。
class_name	×	htmlのクラス名を指定します。ツリー要素のアイコンを変更したいときに利用します。

記述例(Model)

  class RubricksGroup < ActiveRecord::Base
    acts_as_spinelz_treeview :name => :name, :id => :id, :type => :directory, :children => :find_tree_children, :class_name => 'treeview_icon_group'

    def find_tree_children
      RubricksUser.find(:all, :condtions => [...]) + RubricksGroup.find(:all, :conditions => [...])
    end

    ...
  end

  class RubricksUser < ActiveRecord::Base
    acts_as_spinelz_treeview :name => :name, :id => :id, :type => :file

    def treeview_class_name
      (id / 2 == 0) ? 'even' : 'odd'
    end

    ...
  end

※補足： class_nameを動的に変更する

上記の例のようにtreeview_class_nameメソッドを定義してください。

ツリーを描画する

render_treeview(tree_elements, dom_id, variable, options = {}, with_script = true, &block)

引数名	概要
tree_elements	ツリーのディレクトリ、ファイルとなるオブジェクトまたはその配列。オブジェクトがツリーの要素として定義されている必要があります。定義の仕方は、「Modelをツリーの要素として定義する」を参照してください。
dom_id	ツリーのDOM IDを指定します。
variable	Tree Viewを格納するjavascriptの変数を指定します。
options	Tree Viewのオプションを指定します。Tree Viewを参照してください。ただし、「cssPrefix」は指定できません、'custom_'が使用されます。
with_script	Tree Viewを生成するスクリプトを出力するかどうか。デフォルトはtrue。下記「引数with_scriptについて」を参照してください。
&block	アイテムのテキスト部分を動的に出力したい場合に指定します。ブロックは、tree_elemensの要素を引数として受け取ります。

記述例(View) 下記2つの記述は同じHTMLを出力します。

  ...
  <%# ブロックを指定しない場合は、'='をつける %>
  <%= render_treeview(RubricksGroup.find(:all), 'group_tree', 'rubricks.system.group_tree', {:open => false}) %>

  <%# ブロックを指定する場合は、'='をつけない %>
  <% render_treeview(RubricksGroup.find(:all), 'group_tree', 'rubricks.system.group_tree', {:open => false}) do |obj| %>
    <span title="<%= hl(obj.name) %>"><%= hl(obj.name) %></span>
  <% end %>
  ...

※補足：引数with_scriptについて

falseを指定すると出力されるのはHTMLだけになります。(variable = new TreeView?('dom_id', {...}); // 左記が行われません。)
独自にTree Viewの生成を行ってください。
- 生成を行わなかったり、引数variableと違う名前の変数にインスタンスを格納すると、javascriptエラーの原因となるので注意してください。

※補足：ブロックについて

ブロックを指定する場合は、"<%="ではなく"<%"とすることに注意してください。

※補足：生成されるDOMのidについて

ツリーのDOM IDは、「render_treeviewの引数id」となります。
- 例えばこのページの例だと、「group_tree」となります。
アイテムのDOM IDは、「render_treeviewの引数id」 + 「クラス名」 + 「acts_as_spinelz_treeviewのidオプション」となります。
- 例えばこのページの例だと、「group_tree_rubricks_group_1」、「group_tree_rubricks_group_2」、「group_tree_rubricks_user_1」などになります。
アイコンのDOM IDは、「render_treeviewの引数id」 + 「render_treeviewのiconIdPrefixオプション（デフォルトは「treeview_icon」）」 + 「クラス名」 + 「acts_as_spinelz_treeviewのidオプション」となります。
- 例えばこのページの例だと、「group_tree_treeview_icon_rubricks_group_1」、「group_treeview_icon_tree_rubricks_group_2」、「group_treeview_icon_tree_rubricks_user_1」などになります。

Download in other formats:

Plain Text