CFTREE |
説明 フォーム内にツリーコントロールを挿入します。また、ユーザーの選択を検証します。cfform タグブロック内で使用します。ColdFusion のクエリーを使用して、ツリーにデータを提供することができます。
カテゴリ フォームタグ
シンタックス
    <cftree name = "name"
    format="applet"、"flash"、xml、"object"
       required = "yes"、"no"
       delimiter = "delimiter"
       completePath = "yes"、"no"
       appendKey = "yes"、"no"
       highlightHref = "yes"、"no"
       onValidate = "script_name"
       message = "text"
       onError = "text"
       lookAndFeel = "motif"、"windows"、"metal" のいずれか
       font = "font"
       fontSize = "size"
       italic = "yes"、"no"
       bold = "yes"、"no"
       height = "integer"
       width = "integer"
       vSpace = "integer"
       hSpace = "integer"
       align = "alignment"
       border = "yes"、"no"
       hScroll = "yes"、"no"
       vScroll = "yes"、"no""
       style = "style specification"
       enabled = "Yes"、"No"
       visible = "Yes"、"No"
       tooltip = "tip text"
    onChange = "ActionScript"
       notSupported = "text">

    </cftree>
関連項目 cfapplet、cfcalendar、cfform、cfformgroup、cfformitem、cfgrid、cfinput、cfselect、cfslider、cftextarea、cftreeitem、『ColdFusion MX 開発ガイド』の第26章の「データの取得および形式設定について」 の「アクションページの操作」および第27章の「cfform タグによるダイナミックフォームの作成」 の「cftree タグによるツリーコントロールの構築」
ヒストリ ColdFusion MX 7: format 属性が追加され、Flash や XML およびオブジェクトの出力に対するサポートが追加されました。 enabled、onChange、style、tooltip、および visible の各属性が追加されました (Flash 形式の場合のみ)。 ColdFusion MX: 動作の変更 : ColdFusion では、treeitems が含まれるかどうかにかかわらず、ツリーコントロールが表示されます。
メモ: | XML 形式では、ColdFusion MX はすべての属性を XML に渡します。用意された XSLT スキンでは XML 形式のツリーは処理または表示されませんが、アプレットおよび Flash 形式のツリーは表示されます。
メモ: | すべての属性は XML 形式で生成された XML に渡されますが、cftree XML を解釈する ColdFusion MX スキンはありません。
使用方法 このタグは、cfform タグブロックの内部で使用する必要があります。 アプレット形式のツリーでは、クライアントが Java アプレットをダウンロードする必要があります。また、クライアントに最新の Java プラグインがインストールされていない場合、アプレット形式のツリーを表示するために最新の Java プラグインをダウンロードしなければならないこともあります。Flash 形式のツリーでは Flash コントロールを使用します。このツリーは、HTML 形式の cfform タグに埋め込むことができます。このタグを Flash 形式またはアプレット形式のいずれかで正しく動作させるには、JavaScript 対応のブラウザを使用する必要があります。
メモ: | HTML 形式フォームのこのタグに対して Flash 形式を指定し、height 属性と width 属性を指定しない場合、Flash 形式での表示は画面上の表示可能領域を越えるサイズになります。ツリーの後に他の出力 (フォームコントロールなど) が続く場合、それを表示するにはスクロールする必要があります。したがって、HTML フォームで Flash ツリーの後に他の出力を続ける場合は、height と width の値を指定してください。
次の条件を満たす場合、このタグのオプションとして挿入されるユーザーが選択したクエリーデータからの値は、ユーザーがフォームを送信した後も継続して表示されます。 cfform の preserveData 属性が "Yes" に設定されている場合 cfform の action 属性がフォーム自身と同じページ (デフォルト) に送信される場合、または、ユーザー入力フォーム上のコントロールと同じ名前のコントロールを持つフォームがアクションページ上にある場合 詳細については、cfform タグのエントリを参照してください。
フォーム変数 ツリー項目を選択し、ツリーを含むフォームを送信すると、アクションページの Form スコープで 2 つの変数を持つ構造体が作成されます。構造体名はツリー名です。次のフィールドがあります。
オブジェクト形式 format 属性で object を指定した場合は、ツリーは ColdFusion 構造体として返され、ブラウザには送信されません。たとえば、構造体をループしてメニューを挿入、ページを移動するための "breadcrumb" リンクを生成、または dhtml ツリーを作成することができます。
メモ: | XML 形式のフォームでオブジェクト形式のツリーを指定しない場合、ColdFusion はこのツリーを生成しません。
構造体変数名は、cftree name 属性で指定します。構造体の最上位レベルには、次の 2 つのエントリがあります。 属性設定 子配列
構造体には、次の cftree 属性の値を持つ最上位レベルのエントリがあります。
最上位レベルの子エントリは、項目エントリの配列です。各項目には次のエントリがあります。
例 次の例では、cfdocexamples データベースの CourseList テーブルの中から利用可能なコースを表示するツリーを作成し、部門ごとのコースをフォルダに配置します。この例は Flash で表示され、Departments リストを使用して部門名を取得します。
    <cfquery name="getCourses" datasource="cfdocexamples">
       select d.dept_name, c.course_id, c.CorName, c.CorLevel, c.corName +' ( ' +c.corLevel +' )'
    as corLabel
       from CourseList c, Departments d
       where d.Dept_ID = c.Dept_ID
       order by d.dept_Name, c.corName, c.corLevel
    </cfquery>

    <cfform name="studentForm" format="flash" width="400" height="450">
       <cftree name="courseTree"  width="350" height="400">
          <cftreeitem
             query="getCourses"
             value="dept_name,Course_id"
             display="dept_name,CorLabel" queryasroot="NO" expand="yes,no">
       </cftree>
    </cfform>
次の例では、部門別に構成された、組織内の全従業員に関する基本情報を示すツリーを作成します。部門を展開すると、全従業員が表示されます。プラス記号 (+) をクリックすると、追加情報が表示されます。従業員名をクリックすると、同じページに戻り、選択対象の Path およびノードの値が表示されます。
    <!--- データソースにクエリーを実行して、従業員情報を取得します。 --->
    <!--- 出力を部門別にグループ化します
       (Group By 節にはすべてのフィールドが必要です)。 --->
    <cfquery name = "GetEmployees" dataSource = "cfdocexamples">
       SELECT  Emp_ID, FirstName, LastName, EMail, Phone, Department
       FROM Employees
       GROUP BY Department, Emp_ID, FirstName, LastName, EMail, Phone
    </cfquery>
    <html>
    <body>
    <h3>cftree の例</h3>

    <!--- ツリー内のリンクをクリックすると、次の処理が実行されます。
       アプリケーション全体で追加処理に ID を使用します。 --->

    <cfif isdefined("Form.fieldnames")>
    <b>選択された項目の情報</b><br>
    <cfoutput>
    <b>Path:</b>#form.Employees.Path#<br>
    <b>node:</b>#form.Employees.node#<br>
    <br>
    </cfoutput>
    </cfif>

    <!--- ツリーを表示します。cfform 内に cftree タグが必要です。 --->
    <cfform action="#cgi.script_name#" preservedata="Yes" format="Flash">
       <cftree name = "Employees" height = "400" width = "400"
          font = "Arial Narrow" italic="yes" highlighthref="No" HScroll="no" VScroll="no"
          completepath="no" lookandfeel="windows" border="No" required="yes">
          <!--- group 属性を使用する cfoutput タグが部門をループします。 --->
          <cfoutput group="Department" query = "GetEmployees">
             <cftreeitem value="#Department#" parent="Employees" expand="yes">
             <!--- この cfoutput タグが部門のレコードをループします。
                   cfouput タグには属性は必要ありません。 --->
             <cfoutput>
                <!--- 部門内の各従業員に対して項目を作成します。
                   子は展開しません。各従業員名はこのページにリンクし、
                   クエリー文字列内の従業員 ID を送信します。--->
                <cftreeitem value = "#LastName#, #FirstName#"
                   parent = "#Department#" expand="false" img="cd"
                   href="#cgi.script_name#?user_id=#emp_id#">
                <!--- 各従業員エントリには、ID および連絡先情報の子があります。 --->
                <cftreeitem value = "#Emp_ID#" display = "Employee ID:#Emp_ID#"
                   parent = "#LastName#, #FirstName#" img="remote">
                <!--- 各ノードは固有の値である必要があるため、Emp_ID om 値を使用します。 --->
                <cftreeitem value = "#Emp_ID#_ContactInfo" img="computer"
                   display = "Contact Information"
                   parent = "#LastName#, #FirstName#" expand = "false">
                <!--- ContacInfo には 2 つの子があります。 --->
                <cftreeitem value = "#Phone#" parent = "#Emp_ID#_ContactInfo">
                <cftreeitem value = "#Email#" parent = "#Emp_ID#_ContactInfo">
             </cfoutput>
          </cfoutput>
       </cftree>
       <cfinput type="Submit" name="submitit" value="Submit" width="100">
    </cfform>

NAME |
| 必須
| すべて
ツリーコントロールの名前です。

FORMAT |
| オプション
| すべて
Default value: "applet" applet: ブラウザで Java アプレットを使用してツリーを表示します。 flash: Flash コントロールを使用してツリーを表示します。 object: name 属性で指定された名前を持つ ColdFusion 構造体としてツリーを返します。構造体の内容の詳細については、「オブジェクト形式」を参照ください、 xml: ツリーの XML 表示を生成します。 XML 形式フォームでは、フォーム内に生成された XML を含みます。 HTML 形式フォームでは、name 属性で指定された名前を使って XML を文字列変数に配置します。

REQUIRED |
| オプション
| アプレット、Flash
Default value: "No" Yes: ユーザーはツリーコントロール内の項目を選択する必要があります。 No

DELIMITER |
| オプション
| すべて
アクションページの Forms.treename.path 変数内で要素を区切る文字です。

COMPLETEPATH |
| オプション
| アプレット、オブジェクト
Default value: "No" Yes: Form.treename.path 変数は、cftree が送信されたときのツリーパスのルートで始まります。 No: Form.treename.path 変数ではルートレベルを省略します。この変数は、ツリー内の最初の子ノードで始まります。 cfform の preserveData 属性がツリーに対して機能するためには、この属性を Yes に設定する必要があります。 クエリーによって挿入されるツリー項目については、cftreeitem queryasroot 属性を使用してルート名を指定した場合、その値が返されます。ルート名を指定しない場合は、クエリー名が返されます。

APPENDKEY |
| オプション
| すべて
Default value: "Yes" Yes: cftreeitem href 属性を使用する場合、ColdFusion は、選択されたツリー項目の値を持つ CFTREEITEMKEY クエリー文字列変数を cfform アクション URL に追加します。 No: ツリー項目の値を URL に追加しません。

HIGHLIGHTHREF |
| オプション
| アプレット、オブジェクト
Default value: "Yes" Yes: href 属性を指定するすべての cftreeitem タグについて、表示される値をリンクとして強調表示します。 No: 強調表示は無効になります。

ONVALIDATE |
| オプション
| アプレット
ユーザー入力を検証するための JavaScript 関数です。JavaScript DOM フォームオブジェクト、入力オブジェクト、および入力オブジェクト値が、指定されているルーチンに渡されます。検証に成功すると true が返されます。検証に失敗すると false が返されます。

MESSAGE |
| オプション
| アプレット
検証に失敗した場合に表示されるメッセージです。

ONERROR |
| オプション
| アプレット
検証がエラーとなった場合に実行する JavaScript 関数です。

LOOKANDFEEL |
| オプション
| アプレット、オブジェクト
Default value: "windows" motif: Motif スタイルでスライダを表示します。 windows: Windows スタイルでスライダを表示します。 metal: Java Swing スタイルでスライダを表示します。 プラットフォームでこのスタイルオプションがサポートされていない場合は、プラットフォームのデフォルトのスタイルが適用されます。

FONT |
| オプション
| アプレット
ツリーコントロール内のテキストの名前です。

FONTSIZE |
| オプション
| アプレット、Flash
ツリーコントロール内のテキストのフォントサイズです (単位 : ポイント)。

ITALIC |
| オプション
| アプレット、Flash
Default value: "No" Yes: ツリーコントロールのテキストがイタリックで表示されます。 No

BOLD |
| オプション
| アプレット、Flash
Default value: "No" Yes: ツリーコントロールのテキストがボールドで表示されます。 No

HEIGHT |
| オプション
| アプレット、Flash
Default value: "320 (アプレットの場合のみ)" ツリーコントロールの高さです (単位 : ピクセル)。Flash 形式でこの属性を省略した場合、ツリーは自動的にサイズ設定されます。

WIDTH |
| オプション
| アプレット、Flash
Default value: "200 (アプレットの場合のみ)" ツリーコントロールの幅です (単位 : ピクセル)。Flash 形式でこの属性を省略した場合、ツリーは自動的にサイズ設定されます。

VSPACE |
| オプション
| アプレット
ツリーコントロールの上下に取る垂直方向の余白です (単位 : ピクセル)。

HSPACE |
| オプション
| アプレット
ツリーコントロールの左右に取る水平方向の余白です (単位 : ピクセル)。

ALIGN |
| オプション
| アプレット、オブジェクト
top left bottom baseline texttop absbottom middle absmiddle right

BORDER |
| オプション
| アプレット、オブジェクト
Default value: "Yes" Yes: ツリーコントロールの周囲にボーダーを表示します。 No

HSCROLL |
| オプション
| アプレット、オブジェクト
Default value: "Yes" Yes: 水平方向にスクロールできます。 No

VSCROLL |
| オプション
| アプレット、オブジェクト
Default value: "Yes" Yes: 垂直方向にスクロールできます。 No

STYLE |
| オプション
| Flash
対応する Flash 要素について、Macromedia Flex で使用するものと同じシンタックスおよびコンテンツを使用する、CSS 形式のスタイル仕様でなければなりません。

ENABLED |
| オプション
| Flash
Default value: "Yes" Flash 形式の場合のみ: コントロールを有効にするかどうかを指定するブール値です。無効なコントロールはライトグレーで表示されます。

VISIBLE |
| オプション
| Flash
Default value: "Yes" Flash 形式の場合のみ: コントロールを表示するかどうかを指定するブール値です。表示されないコントロールが使用するスペースは空白です。

TOOLTIP |
| オプション
| Flash
Flash 形式の場合のみ: マウスポインタをコントロールの上に置いたときに表示されるテキストです。

ONCHANGE |
| オプション
| Flash
ユーザーのアクションに応じてコントロールが変わるときに実行される ActionScript です。 onChange イベントハンドラを指定した場合、ColdFusion アクションページの Form スコープでは選択された項目に関する情報は自動的に取得されません。ActionScript onChange イベントハンドラは、すべての変更と選択を処理する必要があります。

NOTSUPPORTED |
| オプション
| アプレット
Java アプレットベースの cfform コントロールが含まれているページを、Java がサポートされていないブラウザや、Java のサポートが無効になっているブラウザで開いた場合に表示するテキストです。例 : "<b> ColdFusion Java アプレットを表示するには、ブラウザで Java がサポートされていなければなりません。</b>" デフォルトのメッセージ: <b>ColdFusion Java アプレットを表示するには、<br>ブラウザが Java をサポートしている必要があります。</b>

CHILDREN |
| 項目の子項目であり、項目の構造体の配列です。

DISPLAY |
| cftreeitem の display 属性で定義された、ツリー項目のラベルです。

EXPAND |
| 項目を展開して子を表示するようにするかどうかを cftreeitem expand 属性の値で指定します。

HREF |
| ユーザーが項目を選択したときのリンク先の URL です。cftreeitem href 属性の値で指定します。

IMG |
| ツリー項目のアイコンとして表示する、ツリーのアイコンイメージです。cftreeitem img 属性の値で指定します。

IMGOPEN |
| ツリー項目が開かれた (展開された) ときに表示するイメージです。cftreeitem imgopen 属性の値で指定します。

PARENT |
| ツリーにおけるこの項目の親項目の値です。

PATH |
| ツリールートから現在の要素へのノードパスです。

QUERYASROOT |
| クエリーがこの項目のルートであるかどうかを、cftreeitem の queryAsRoot 属性の値で指定します。

TARGET |
| _blank などのリンクターゲットです。項目の cftreeitem の target 属性の値で指定します。

VALUE |
| cftreeitem value 属性で指定された、項目の値です。

PATH |
| 選択したノードに至るまでのツリー上のパスです。フォームは [root]node_1node_2... です。アプレット形式では、completePath 属性が true の場合に限り、このパスにはルートノードが含まれます。Flash 形式では、このパスには常にルートノードが含まれます。

NODE |
| 選択したツリーノードの値です。

ALIGN |
| completePath
Default value: "highlightHref" lookAndFeel

APPENDKEY |
| delimiter
Default value: "hScroll" name

BOLD |
| fontWeight
Default value: "italic" vscroll

BORDER |