# CFTREEITEM

Use CFTREEITEM to populate a tree control created with CFTREE with individual elements. You can use the IMG values supplied with ColdFusion or reference your own icons.

Note | CFTREEITEM incorporates a Java applet, so a browser must be Java- enabled for CFTREE to work properly.

### Syntax

    <CFTREEITEM VALUE="text"
        DISPLAY="text"
        PARENT="parent_name"
        IMG="filename"
        IMGOPEN="filename"
        HREF="URL"
        TARGET="URL_target"
        QUERY="queryname"
        QUERYASROOT="Yes/No"
        EXPAND="Yes/No">

#### VALUE

Required. Value passed when the CFFORM is submitted. When populating a CFTREE with data from a CFQUERY, columns are specified in a comma-separated list:

    VALUE="dept_id,emp_id"

#### DISPLAY

Optional. The label for the tree item. Default is VALUE. When populating a CFTREE with data from a CFQUERY, display names are specified in a comma-separated list:

    DISPLAY="dept_name,emp_name"

#### PARENT

Optional. Value for tree item parent.

#### IMG

Optional. Image name or filename for the tree item. When populating a CFTREE with data from a CFQUERY, images or filenames for each level of the tree are specified in a comma-separated list.

The default image name is "Folder. " A number of images are supplied and can be specified using only the image name (no file extension):

- cd
- computer
- document
- element
- folder
- floppy
- fixed
- remote

Use commas to separate image names corresponding to tree level, for example:

    IMG="folder,document"
    IMG=",document

To specify your own custom image, specify the path and file extension:

    IMG="../images/page1.gif"

#### IMGOPEN

Optional. Icon displayed with open tree item. You can specify the icon filename using a relative path. As with IMG, you can use an image supplied with ColdFusion.

#### HREF

Optional. URL to associate with the tree item or a query column for a tree that is populated from a query. If HREF is a query column, then the HREF value is the value populated by the query. If HREF is not recognized as a query column, it is assumed that the HREF text is an actual HTML HREF.

When populating a CFTREE with data from a CFQUERY, HREFs can be specified in a comma-separated list

    HREF="http://dept_server,http://emp_server"

#### TARGET

Optional. Target attribute for HREF URL. When populating a CFTREE with data from a CFQUERY, targets are specified in a comma-separated list:

    TARGET="FRAME_BODY,_blank"

#### QUERY

Optional. Query name used to generate data for the tree item.

#### QUERYASROOT

Optional. Yes or No. Defines specified query as the root level. As in Example 1, this option prevents having to create an additional parent CFTREEITEM.

#### EXPAND

Optional. Yes or No. Yes expands tree to show tree item children. No keeps tree item collapsed. Default is Yes.

### Example

    <!--- This example shows the use of CFTREEITEM in a CFFORM.
    The query takes a list of employees, and uses CFTREE and CFSELECT
    to display the results of the query.  In addition, CFGRID is used
    to show an alternate means of displaying the same data --->

    <!--- set a default for the employeeNames variable --->
    <CFPARAM NAME="employeeNames" DEFAULT="">

    <!--- if an employee name has been passed from the form,
    set employeeNames variable to this value ---Auto>
    <CFIF IsDefined("form.employeeNames")>
        <CFSET employeeNames = form.employeeNames>
    </CFIF>

    <!--- query the datasource to find the employee information--->
    <CFQUERY NAME="GetEmployees" DATASOURCE="cfsnippets">
    SELECT   Emp_ID, FirstName, LastName, EMail, Phone, Department
    FROM     Employees where lastname
             <CFIF #employeeNames# is not "">= '#employeeNames#'</CFIF>
    </CFQUERY>

    <HTML>
    <HEAD>
    <TITLE>
    CFTREE Example
    </TITLE>
    </HEAD>

    <BODY>
    <H3>CFTREEITEM Example</H3>

    <!--- Use CFFORM when using other CFINPUT tools --->
    <CFFORM ACTION="cftreeitem.cfm" METHOD="POST" ENABLECAB="Yes">

    <!--- Use CFSELECT to present the contents of the query by column --->
    <H3>CFSELECT Presentation of Data</H3>
    <H4>Click on an employee's last name and hit "see information for
    this employee" to see expanded information.</H4>
    <CFSELECT NAME="EmployeeNames" MESSAGE="Select an Employee Name"
        SIZE="#getEmployees.recordcount#" QUERY="GetEmployees"
        VALUE="LastName" REQUIRED="No">
        <OPTION value="">Select All
    </CFSELECT>

    <INPUT TYPE="Submit" NAME="" VALUE="see information for this employee">

    <!--- showing the use of CFTREE --->
    <!--- Use CFTREE for an expanded presentation of the data --->
    <!--- Loop through the query to create each branch of the CFTREE --->
    <H3>CFTREE Presentation of Data</H3>
    <H4>Click on the folders to "drill down" and reveal information.</H4>
    <P>CFTREEITEM is used to create the "branches" of the tree.
    <P>
    <CFTREE NAME="SeeEmployees" HEIGHT="150" WIDTH="240"
        FONT="Arial Narrow" BOLD="No"
        ITALIC="No" BORDER="Yes"
        HSCROLL="Yes" VSCROLL="Yes"
        REQUIRED="No" COMPLETEPATH="No"
        APPENDKEY="Yes" HIGHLIGHTHREF="Yes">
    <CFLOOP QUERY="GetEmployees">
        <CFTREEITEM VALUE="#Emp_ID#" PARENT="SeeEmployees" EXPAND="No">
        <CFTREEITEM VALUE="#LastName#" DISPLAY="Name"
            PARENT="#Emp_ID#" QUERYASROOT="No"
            EXPAND="No">
        <CFTREEITEM VALUE="#LastName#, #FirstName#"
            PARENT="#LastName#" EXPAND="No"
            QUERYASROOT="No">
        <CFTREEITEM VALUE="#Department#" DISPLAY="Department"
            PARENT="#Emp_ID#" QUERYASROOT="No"
            EXPAND="No">
        <CFTREEITEM VALUE="#Department#" PARENT="#Department#"
            EXPAND="No" QUERYASROOT="No">
        <CFTREEITEM VALUE="#Phone#" DISPLAY="Phone"
            PARENT="#Emp_ID#" QUERYASROOT="No"
            EXPAND="No">
        <CFTREEITEM VALUE="#Phone#" PARENT="#Phone#"
            EXPAND="No" QUERYASROOT="No">
        <CFTREEITEM VALUE="#Email#" DISPLAY="Email"
            PARENT="#Emp_ID#" QUERYASROOT="No"
            EXPAND="No">
        <CFTREEITEM VALUE="#Email#" PARENT="#Email#"
            EXPAND="No" QUERYASROOT="No">
    </CFLOOP>
    </CFTREE>
    ...