Cold Fusion Tag for dhtmlXTree

This chapter also included into main documentation for dhtmlXTree. <cf_dhtmlXTree name="tree" width="250" height="250" JSPath="../" CSSPath="../" iconspath="gfx/" xmldoc="tree.xml" checkboxes="false" dragndrop="true" style="background-color:whitesmoke;border:1px solid blue;" onSelect="onNodeSelect" onDrop="onDropNode"> ...configuration xml... </cf_dhtmlXTree>
  • name - [optional] name of the tree js object to use in javascript, if skiped, then name autogenerated
  • width - [optional] width of the tree (definitely it sets the with of the tree box, leaving the with of the tree itself by 100%)
  • height - [optional] height of the tree
  • JSPath - [optional] absolute or relative path to directory which contains tree js files, "js" directory by default
  • CSSPath - [optional] absolute or relative path to directory which contains tree css files, "css" directory by default
  • iconspath - [optional] absolute or relative path to directory which contains tree icon files, "img" directory by default
  • xmldoc - [mandatory for xml loading] url of the xml file used to load levels dynamically
  • checkboxes - [optional] show checkboxes (none, twoState, threeState)
  • dragndrop - [optional] activate drag-&-drop (true,false)
  • style - [optional] style for the tree box
  • onSelect - [optional] javascript function to call on node selection
  • oncheck - [optional] javascript function to call on node (un)checking
  • onDrop - [optional] javascript function to call on node drop
  • im1 - [optional] default image used for child nodes
  • im2 - [optional] default image used for opened branches
  • im3 - [optional] default image used for closed branches

  • For description of optional configuration xml - see chapter "Loading data with XML"

    Minimal possible tag syntax with on-page xml: <cf_dhtmlXTree> <item text="Top node" id="t1" > <item text="Child node 1" id="c1" ></item> <item text="Child node 2" id="c2" ></item> </item> </cf_dhtmlXTree> Minimal possible tag syntax with server-side xml: <cf_dhtmlXTree xmldoc="tree.xml"> </cf_dhtmlXTree> With images specified: <cf_dhtmlXTree im1="book.gif" im2="books_open.gif" im3="books_close.gif"> <item text="Mystery " id="mystery" open="yes" > <item text="Lawrence Block" id="lb" > <item text="All the Flowers Are Dying" id="lb_1" /> <item text="The Burglar on the Prowl" id="lb_2" /> <item text="The Plot Thickens" id="lb_3" /> <item text="Grifters Game" id="lb_4" /> <item text="The Burglar Who Thought He Was Bogart" id="lb_5" /> </item> <item text="Robert Crais" id="rc" > <item text="The Forgotten Man" id="rc_1" /> <item text="Stalking the Angel" id="rc_2" /> <item text="Free Fall" id="rc_3" /> <item text="Sunset Express" id="rc_4" /> <item text="Hostage" id="rc_5" /> </item> <item text="Ian Rankin" id="ir" ></item> <item text="James Patterson" id="jp" ></item> <item text="Nancy Atherton" id="na" ></item> </item> </cf_dhtmlXTree> With Events Handlers,Checkboxes and Drag-n-drop: <cf_dhtmlXTree dragndrop="true" checkboxes="twoState" onSelect="onClick" onCheck="onCheck" onDrop="onDrag"> <item text="Mystery " id="mystery" open="yes" > <item text="Lawrence Block" id="lb" > <item text="All the Flowers Are Dying" id="lb_1" /> <item text="The Burglar on the Prowl" id="lb_2" /> <item text="The Plot Thickens" id="lb_3" /> <item text="Grifters Game" id="lb_4" /> <item text="The Burglar Who Thought He Was Bogart" id="lb_5" /> </item> <item text="Robert Crais" id="rc" > <item text="The Forgotten Man" id="rc_1" /> <item text="Stalking the Angel" id="rc_2" /> <item text="Free Fall" id="rc_3" /> <item text="Sunset Express" id="rc_4" /> <item text="Hostage" id="rc_5" /> </item> <item text="Ian Rankin" id="ir" ></item> <item text="James Patterson" id="jp" ></item> <item text="Nancy Atherton" id="na" ></item> </item> </cf_dhtmlXTree>