Dhtmlxtree Tutorial--a JavaScript tree with a check box __html

Looking for a JavaScript tree with a check box on the Internet, looking for a lot are not very satisfied, finally found the dhtmlxtree.

About Download Dhtmlxtree I will not say, Baidu on a search there.

Download down and open dhtmlxtree/samples/treeex23.html

This is the best example of the javacript tree we need with the checkbox, see the three-state tree, the so-called three-state tree is, the selection box has three states, checked, unchecked and semi-selected state (when the folder appears)

With EditPlus Open treeex23.html source, find: Tree2 = new Dhtmlxtreeobject ("Treeboxbox_tree2", "100%", "100%", 0);
Tree2.setimagepath (".. /imgs/");
Tree2.enablecheckboxes (1);
Tree2.enablethreestatecheckboxes (TRUE);
Tree2.loadxml ("Tree3.xml");

This piece of code can be moved directly to the Web page to use, to be concerned about is:
1, Treebosbox_tree2 is you want to hook up the tree div node
2, Tree2.setimagepath is the dhtmlxtree need to set the picture, this is very important, because the Dhtmlxtree check box is a picture
3, Tree3.xml is the data tree

What we need to change is tree3.xml. XML version= "1.0" encoding= "Utf-8"?>
< tree ID = "0" >
< Item text = "National" id = "Country" open= "1" >
< item id = "BJ" text = "Beijing"/>
< item id = "SH" text = "Shanghai"/>
< item id = "TJ" text = "Tianjin"/>
< item id = "FJ" text = "Fujian" >
< item id = "XM" text = "Xiamen"/>
</Item >
</Item >
</Tree >

Note the point:
1. If you want to use Chinese in dhtmlxtree, you must change the encoding to Utf-8, save the file, and choose the encoding form as utf-8 when you save it.
2, the tree node of the id= "0" can not be province

This is the display effect:

Everyone is smart, the above XML I don't explain, next I say how to get the selected node

There are three links on the tree edge of the page, see the third get list of checked, this function is to obtain all the selected Node ID, we look directly at the source code:

Tree2.getallchecked ();

In this sentence, simple, it is so simple that the node of this tree can be connected with the "," number into a string