Dwz (Jui) Tutorial tree control selection event

Dwz (Jui) Tutorial tree control selection event

Sina Weibo http://weibo.com/u/1534913940

Recently, a friend left a message asking how to deal with the selected event of the tree control. Today I will give a brief introduction.

Let's briefly talk about the process.

The first step is to define the callback event first.

function checkCallback(json){     ...........     ...........}

The key is the structure {checked: Boolean value, items: array} returned by the callback function}

If the selected event checked is true, otherwise false

Items is an array of objects [{Name:, value:, text :},{}]. It returns the selected node. If the returned checked is false, it is a invert event, the length is 0.

Name is the name of the node. value is the corresponding value. Text is the tname tvalue of the node corresponding to the text of the node. <A> text </a> text information

The tree control is automatically cascade. When the parent node is selected, the child node is also selected. Therefore, the returned selected node is an array. Of course, if it is a leaf node, its length is 1.

Step 2: register to the DOM Element

<Ul class = "tree treefolder treecheck expand" oncheck = "checkcallback">

This makes it easy to use.

Below I will briefly comment on the source code, so that everyone will be more clear.

SetTimeout (function () {if ($ this. hasclass ("treecheck") {// obtain the selected event is the event var checkfn = eval ($ this. ATTR ("oncheck"); If (checkfn & $. isfunction (checkfn) {$ ("Div. ckbox ", $ this ). each (function () {var ckbox =$ (this); ckbox. click (function () {// return whether the event type is selected var checked =$ (ckbox ). hasclass ("checked"); var items = []; If (checked) {// check whether the source code structure is actually the Li element var tnode =$ (ckbox) of the node ). parent (). parent (); // get all nodes before checkbox var boxes =$ ("input", tnode); If (boxes. size ()> 1) {// corresponds to the returned structure $ (boxes ). each (function () {items [items. length] = {Name: $ (this ). ATTR ("name"), value: $ (this ). val (), text: $ (this ). ATTR ("text") };}) ;}else {items = {Name: boxes. ATTR ("name"), value: boxes. val (), text: boxes. ATTR ("text") };}// call the function checkfn ({checked: checked, items: items });});});}}

1. The key callback functions of X are a little thin and non-standard. I hope they will be helpful in the future of 2.x.

Reprint please indicate the source http://blog.csdn.net/jiweigang1/article/details/8454474