CFML Reference
ColdFusion Tags

cftree

Description

Lets you put a tree control in a cfform. Validates user selections. Tree items are created with cftreeitem tags inside the cftree tag block. You can use a ColdFusion query to supply data to the tree.

Category

Forms tags

Syntax

<cftree name = "name"

  required = "Yes" or "No"

  delimiter = "delimiter"

  completePath = "Yes" or "No"

  appendKey = "Yes" or "No"

  highlightHref = "Yes" or "No"

  onValidate = "script_name"

  message = "text"

  onError = "text"

  lookAndFeel = "motif" or "windows" or "metal"

  font = "font"

  fontSize = "size"

  italic = "Yes" or "No"

  bold = "Yes" or "No"

  height = "integer"

  width = "integer"

  vSpace = "integer"

  hSpace = "integer"

  align = "alignment"

  border = "Yes" or "No"

  hScroll = "Yes" or "No"

  vScroll = "Yes" or "No"

  notSupported = "text">

 

</cftree> 

See also

cfapplet, cfform, cfgrid, cfgridcolumn, cfgridrow, cfgridupdate, cfinput, cfselect, cfslider, cftextinput, cftreeitem

Attributes

Attribute	Description
name	Required. A name for the cftree control.
required	Optional. Yes or No. Whether user must select an item in the tree control. Default is No.
delimiter	Optional. The character used to separate elements in the form variable path. The default is "\".
completePath	Optional. Yes passes the root level of the treename.path form variable when the cftree is submitted. If omitted or No, the root level of this form variable is not included. You must set this attribute to Yes for the preserveData attribute of cfform to work with the tree.
appendKey	Optional. Yes or No. When used with href, Yes passes the CFTREEITEMKEY variable along with the value of the selected tree item in the URL to the application page specified in the cfform action attribute. The default is Yes.
highlightHref	Optional. Yes highlights links associated with a cftreeitem with a URL attribute value. No disables highlight. Default is Yes.
onValidate	Optional. The name of a valid JavaScript function used to validate user input. The form object, input object, and input object value are passed to the specified routine, which should return true if validation succeeds and false otherwise.
message	Optional. Message text to appear if validation fails.
onError	Optional. The name of a JavaScript function to execute in the event of a failed validation.
lookAndFeel	Optional. Stylistic choice for the slider. One of the following: motif    Renders the slider using Motif style. windows    (default) Renders the slider using Windows style. metal    Renders the slider using Java Swing style. If your platform cannot support your style choice, the tag defaults to using the platform's default style.
font	Optional. Font name to use for data in the tree control.
fontSize	Optional. Font size for text in the tree control, in points.
italic	Optional. Yes or No. Yes displays tree control text in italic. Default is No.
bold	Optional. Yes or No. Yes displays tree control text in boldface. Default is No.
height	Optional. Height of the tree control, in pixels.
width	Optional. Width of the tree control, in pixels.
vSpace	Optional. Vertical margin spacing above and below the tree control, in pixels.
hSpace	Optional. Horizontal spacing to the left and right of the tree control, in pixels.
align	Optional. Alignment value. Options are: Top Left Bottom Baseline TextTop AbsBottom Middle AbsMiddle Right
border	Optional. Places a border around the tree. Default is Yes.
hScroll	Optional. Permits horizontal scrolling. Default is Yes
vScroll	Optional. Permits vertical scrolling. Default is Yes.
notSupported	Optional. Text to display if the page containing a Java applet-based cfform control is opened by a browser that does not support Java or has Java support disabled. For example: notSupported = "<B> Browser must support Java to view ColdFusion Java Applets</B>" By default, if no message is specified, the following message displays: <B>Browser must support Java to <BR> view ColdFusion Java Applets!</B>

Usage

Example

<!--- This example shows the use of cftree 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 --->

<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>cftree Example</H3>



<!--- Use cfform when using other cfinput tools --->

<cfform action = "cftree.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>

...

Copyright © 2001, Macromedia Inc. All rights reserved.

---