DHTML Tree Special Technics

Links in tree

Xml for the tree:
<tree..> <item ...> <userdata name=“myurl“>http://www.google.com</userdata> <item ...> <userdata name=“myurl“>http://groups.google.com</userdata> </item> </item>
there is an event handler for click processing: tree.setOnClickHandler(doOnClick); function doOnClick(nodeId){ var myUrl = tree.getUserData(nodeId,“myurl“); window.open(myUrl);// or frames[“someframe“].location.href = myUrl }

Drag-n-drop outside tree

Any page control can be set as “landing zone”. Here is an example: <div id="treeboxbox_tree" style="width:200;height:200"></div> <input type="text" width="120px" id="sInput"> <script> tree=new dhtmlXTreeObject("treeboxbox_tree","100%","100%",0); tree.setImagePath("../imgs/"); //user defined drag and drop control with event handlers inside function s_control(){ //action occures on drag this._drag=function(sourceHtmlObject,dhtmlObject,targetHtmlObject){ targetHtmlObject.style.backgroundColor=""; targetHtmlObject.value=sourceHtmlObject.parentObject.label; } //action occures on drag moved in landing zone this._dragIn=function(htmlObject,shtmlObject){ htmlObject.style.backgroundColor="#fffacd"; return htmlObject; } //action occures on drag moved out landing zone this._dragOut=function(htmlObject){ htmlObject.style.backgroundColor=""; return this; } } //set input control as “landing zone” tree.dragger.addDragLanding(document.getElementById('sInput'), new s_control); </script>