<! Doctype HTML public "-// W3C // dtd html 4.01 transitional // en"
Http://www.w3.org/TR/html4/loose.dtd
">
<HTML>
<Head>
<Title> untitled document </title>
<Meta http-equiv = "Content-Type" content = "text/html; charset = iso-8859-1">
<SCRIPT type = "text/JavaScript">
VaR djconfig = {isdebug: True, debugatallcosts: true };
</SCRIPT>
<SCRIPT type = "text/JavaScript" src = "http://www.cnblogs.com/../dojo.js"> </SCRIPT>
<SCRIPT type = "text/JavaScript">
Dojo. Require ("dojo. widget .*");
Dojo. Require ("dojo. widget. treev3 ");
Dojo. Require ("dojo. widget. treenodev3 ");
Dojo. Require ("dojo. widget. treebasiccontrollerv3 ");
Dojo. Require ("dojo. widget. treedociconextension ");
Dojo. Require ("dojo. widget. treeselectorv3 ");
Dojo. Require ("dojo. widget. treeemphasizeonselect ");
Dojo. Require ("dojo. widget. treeexpandonselect ");
Dojo. Require ("dojo. widget. treetoggleonselect ");
// The node of the tree performs a super connection.
// Add a div and write object = "href: http: //..." on the node ://...".
Dojo. Require ("dojo. widget. treelinkextension ");
// The content is not broken
Dojo. Require ("dojo. widget. treedisablewrapextension ");
// Drag
Dojo. Require ("dojo. widget. treedndcontrollerv3 ");
// Context menu
Dojo. Require ("dojo. widget. treecontextmenuv3 ");
// This is used to bind context menus and controller events. Extension is required, and methods such as clone are missing.
Dojo. Require ("dojo. widget. treedemo ");
// Menu tag Editor
Dojo. Require ("dojo. widget. treeeditor ");
Dojo. hostenv. writeincludes ();
// Two combination methods
// Method-based
VaR selectaction = function (){
Return function (Message ){
Alert (message. node );
}
}
// Class-based
VaR selectclass = function (){
This. Go = function (Message ){
Alert (message. node. widgetid );
Alert (message. node. isfolder );
}
}
Dojo. addonload (function (){
/* Add debug print for all controller events */
VaR selector = dojo. widget. Manager. getwidgetbyid ('selector ');
// Bind messages in two ways.
// Dojo. event. Topic. subscribe (selector. eventnames ['select'], selectaction ());
Dojo. event. Topic. subscribe (selector. eventnames ['select'], new selectclass (), 'Go ');
// Bind the context menu to the Controller.
Dojo. addonload (function () {dojo. widget. treedemo. binddemomenu (Dojo. widget. byid ("controller "))});
});
// Expand the hierarchy and pay attention to the callback interface.
Function testexpandtolevel (level ){
VaR d = dojo. widget. byid ('controller'). expandtolevel (Dojo. widget. byid ('tree '), level );
// Dojo. widget. byid ('trecontroller'). expandtolevel (Dojo. widget. byid ('item 1.3 '), 3)
// D. addcallback (function () {alert ('done ')});
}
// Add a new node
Function testcreate (){
VaR d =
Dojo. widget. byid ('controller'). createchild (Dojo. widget. byid ('item
1'), 1, {Title: 'tttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttt '});
// D. addcallbacks (printok, printerr );
}
// Edit a node.
Function testedit (){
Dojo. widget. byid ('controller'). editlabelstart (Dojo. widget. byid ('item 1 '));
}
// The contentclass of the node can change the title content.
// Treedociconextension: add an icon to each item. Change docicon's class.
</SCRIPT>
<Style>
. Mycssclass {
Font-family: Arial, Helvetica, sans-serif;
Font-size: 18px;
}
</Style>
</Head>
<Body>
<Div dojotype = "treeeditor" widgetid = "Editor"> </div>
<Div dojotype = "treedociconextension" widgetid = "docicons"> </div>
<Div dojotype = "treebasiccontrollerv3" widgetid = "controller" editor = "Editor"> </div>
<Div dojotype = "treeselectorv3" allowedmulti = "false" widgetid = "selector"> </div>
<Div dojotype = "treeemphasizeonselect" selector = "selector"> </div>
<Div dojotype = "treeexpandtonodeonselect" selector = "selector" Controller = "controller"> </div>
<Div dojotype = "treetoggleonselect" selector = "selector" selectevent = "dblselect" Controller = "controller"> </div>
<Div dojotype = "treelinkextension" widgetid = "Link" Params = "target: _ blank"> </div>
<Div dojotype = "treedisablewrapextension" widgetid = "disablewrap"> </div>
<Div dojotype = "treedndcontrollerv3" Controller = "controller" widgetid = "dndcontroller"> </div>
<Div dojotype = "treecontextmenuv3" toggle = "explode" contextmenuforwindow = "false" widgetid = "contextmenu">
<Div dojotype = "treemenuitemv3" treeactions = "addchild"
Iconsrc = "../images/createsmall.gif" widgetid = "treecontextmenucreate"
Caption = "CREATE"> </div>
<Div dojotype = "treemenuitemv3" treeactions = "Remove"
Iconsrc = "../images/removesmall.gif" caption = "Remove"
Widgetid = "treecontextmenudestroy"> </div>
<Div dojotype = "treemenuitemv3" treeactions = "move"
Iconsrc = "../images/downsmall.png" caption = "up"
Widgetid = "treecontextmenuup"> </div>
<Div dojotype = "treemenuitemv3" treeactions = "move"
Iconsrc = "../images/upsmall.png" caption = "down"
Widgetid = "treecontextmenudown"> </div>
</Div>
<! -- Added the DND function and added dndmode = "between; onto" dndaccepttypes = "Tree" in the tree Div. -->
<Div dojotype = "treev3" dndmode = "between;"
Dndaccepttypes = "tree"
Listeners = "Controller; docicons; selector; Link; disablewrap; contextmenu; dndcontroller"
Widgetid = "Tree">
<Div dojotype = "treenodev3" Title = "item 1"
Object = "href: http://news.sina.com.cn" widgetid = "item 1"
Contentclass = "mycssclass">
<Div dojotype = "treenodev3" Title = "item 1.1" widgetid = "item 1.1" contentclass = "mycssclass"> </div>
<Div dojotype = "treenodev3" Title = "item 1.2" widgetid = "item 1.2" contentclass = "mycssclass"> </div>
<Div dojotype = "treenodev3" Title = "item 1.3" widgetid = "item 1.3" contentclass = "mycssclass">
<Div dojotype = "treenodev3" Title = "Item 1.3.1"
Widgetid = "Item 1.3.1" contentclass = "mycssclass"> </div>
<Div dojotype = "treenodev3" Title = "Item 1.3.2" widgetid = "Item 1.3.2" contentclass = "mycssclass">
<Div dojotype = "treenodev3" Title = "item
1.3.2.1 "widgetid =" item 1.3.2.1"
Contentclass = "mycssclass"> </div>
<Div dojotype = "treenodev3" Title = "item 1.3.3.2" widgetid = "item 1.3.3.2" contentclass = "mycssclass">
<Div dojotype = "treenodev3" Title = "item
1.3.3.2.1 "widgetid =" item 1.3.3.2.1"
Contentclass = "mycssclass"> </div>
</Div>
</Div>
</Div>
</Div>
<! -- Node has the actionsdisabled attribute -->
<Div dojotype = "treenodev3" actionsdisabled = "move" Title = "can't move this node"> </div>
<Div dojotype = "treenodev3" actionsdisabled = "addchild" Title = "can't add child this node"> </div>
</Div>
<Div style = "display: none">
<! -- IE has a bug: It reloads all dynamically resolved images, no matter, is it
New image () or CSS background. If you don't specify images like that,
It will reload them every time a node is expanded -->
</Div>
<! -- Select a node directly, but the existing node cannot be removed. -->
<Input type = "button" value = "select item 1"
Onclick = "dojo. widget. byid ('selector '). Select (Dojo. widget. byid ('item
1 ') "/>
<Input type = "button" value = "expand to level 3" onclick = "testexpandtolevel (100)"/>
<Input type = "button" value = "create new node" onclick = "testcreate ()"/>
<Input type = "button" value = "edit" onclick = "testedit ()"/>
</Body>
</Html>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
