| CFTREEITEM | |||
| Description
Populates a form tree control, created with the cftree tag, with one or more elements. |
|||
| Category
Forms tags | |||
Syntax<cftreeitem value = "text" display = "text" parent = "parent_name" img = "filename" imgopen = "filename" href = "URL" target = "URL_target" query = "queryname" queryAsRoot = "yes" or "no" expand = "yes" or "no"> |
|||
| See also
cfapplet, cfform, cfformgroup, cfformitem, cfgrid, cfinput, cfselect, cfslider, cftextarea, cftree; "Building tree controls with the cftree tag" in Chapter 27, "Building Dynamic Forms with cfform Tags," in ColdFusion MX Developer's Guide
|
|||
| Usage
This tag requires the client to download a Java applet. Downloading an applet takes time; therefore, using this tag might be slightly slower than using an HTML form element or the cfinput tag to get the same information. For this tag to work properly. the browser must be JavaScript-enabled. If you do not use a query to populate this tag, it creates a single tree item. If you do use a query, it creates multiple items; each row of the query creates a hierarchically nested set of items with one item per column. |
|||
| Example
The following example creates a simple tree using a single cftreeitem tag and a query: <cfform action = "#cgi.script_name#">
<cftree name = "Employees" height = "400" width = "200">
<cftreeitem value="LastName, FirstName, Emp_ID" query="getEmployees"
queryAsRoot="False">
</cftree>
</cfform>
The following example creates a tree that shows the basic information about all employees in an organization, organized by department. The departments are expanded to show all employees. You can click the + signs to display additional information. If you click the employee name, ColdFusion links back to the same page and displays the selected employee's ID. <!--- Query the datasource to get employee information.--->
<!--- Group the output by Department.
(All fields are required in Group By clause.) --->
<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>cftreeitem Example</h3>
<!--- The following runs if the user clicked on a link in the tree.
A complete application would use the ID for additional processing. --->
<cfif isdefined("URL.user_ID")>
<cfoutput>
<!--- URL.cftreeitemkey is the selected tree item's value attribute. --->
You Requested information on #URL.cftreeitemKey#; User ID #URL.user_ID#
</cfoutput>
<br><br>
</cfif>
<!--- Display the tree. The cftree tag must be in a cfform. --->
<cfform>
<cftree name = "Employees" height = "400" width = "200"
font = "Arial Narrow" highlighthref="No" hscroll="No">
<!--- cfoutput tag with a group attribute loops over the departments. --->
<cfoutput group="Department" query = "GetEmployees">
<cftreeitem value="#Department#" parent="Employees" expand="yes">
<!--- This cfoutput tag loops over the records for the department.
The cfoutput tag does not need any attributes. --->
<cfoutput>
<!--- Create an item for each employee in the department.
Do not expand children. Each employee name links to this page,
and sends the employee ID in the query string.--->
<cftreeitem value = "#LastName#, #FirstName#"
display = "#LastName#, #FirstName#"
parent = "#Department#" expand="no"
href="#cgi.script_name#?user_id=#emp_id#">
<!--- Each Employee entry has ID and ContactInfo children. --->
<cftreeitem value = "#Emp_ID#" display = "Employee ID: #Emp_ID#"
parent = "#LastName#, #FirstName#">
<!--- Each node must be unique value, so use Emp_ID om value. --->
<cftreeitem value = "#Emp_ID#_ContactInfo"
display = "Contact Information"
parent = "#LastName#, #FirstName#" expand = "No">
<!--- ContactInfo has two children. --->
<cftreeitem value = "#Phone#" parent = "#Emp_ID#_ContactInfo">
<cftreeitem value = "#Email#" parent = "#Emp_ID#_ContactInfo">
</cfoutput>
</cfoutput>
</cftree>
</cfform>
|
|||