Jquery Easyui combotree can only select leaf nodes and leaf nodes have multi-marquee

Jquery Easyui combotree can only select leaf nodes and leaf nodes have multi-marquee

jquery Easyui combotree Single box, jquery Easyui combotree can only select leaf nodes

Easyui combotree leaf node added single box

================================

? Copyright Sweet Potato Yiu April 28, 2018

http://www.cnblogs.com/fanshuyao/

Recommended Use method three (perfect version)

One, mode one, the simplest (can only be single-leaf node, leaf node Front no multi-box)

JS Code

2. $ ("Xxxid"). Combotree ({
4. Data: [{... ...},{......},{...}],//omitted
6. Required: false,
8. Onbeforeselect: function (node) {
10. If (!$ (this). Tree ("isleaf", Node.target)) {//If it is not a leaf node, do not let the selection
12. return false;
14. }
16. }
18. });

Second, the way two: control can only select one item, after selecting an item can not be checked again (experience more blunt)

JS Code

2. $ ("Xxxid"). Combotree ({
4. Multiple: true,//settings can be multi-selected, display multi-box, do not set the multi-box will not appear
6. Data: [{... ...},{......},{...}],//omitted
8. Required: false,
10. CheckBox: True,//Show multi-marquee
12. Onlyleafcheck: True,//Show multiple boxes only on leaf nodes
14. Onbeforeselect: function (node) {
16. If (!$ (this). Tree ("isleaf", Node.target)) {//If it is not a leaf node, do not let the selection
18. return false;
20. }
22. },
24. Onbeforecheck: Function (node, checked) {//control can only select one item
26. if (checked) {//is currently selected
28. var nodes = $ (this). Tree ("getchecked");
30. //control can only select one item, after selecting an item can not be checked again
32. if (nodes.length = = 0) {
34. return true;
36. }else{
38. return false;
40. }
42. }else{//is currently unchecked
44. return true;
46. }
48. }
50. });

Three, way three: arbitrarily choose any one, but only one option (perfect version)

JS Code

2. $ ("Xxxid"). Combotree ({
4. Multiple: true,//settings can be multi-selected, display multi-box, do not set the multi-box will not appear
6. Data: [{... ...},{......},{...}],//omitted
8. Required: false,
10. CheckBox: True,//Show multi-marquee
12. Onlyleafcheck: True,//Show multiple boxes only on leaf nodes
14. Onbeforeselect: function (node) {
16. $ (this). Tree ("Check", node.target); Control the click of text can also be checked
18. return false; Avoid selecting a tick box instead of clicking on the text to appear with a yellow selected stripe
20. },
22. Onbeforecheck: Function (node, checked) {//control can only select one item
24. if (checked) {//is currently selected
26. var nodes = $ (this). Tree ("getchecked");
28. //control can only select one item, after selecting an item can not be checked again
30. if (nodes.length > 0) {
32. For (var i=0; i<nodes.length; i++) {
34. $ (this). Tree ("uncheck", nodes[i].target); Clear the previously selected item
36. }
38. }
40. }
42. }
44. });

Method Three: Onbeforeselect method return False, avoid the first click on the text is selected, then reopen the selection, do not click the text, directly tick the multi-box, the first click of the text has a yellow background, as follows:

================================

? Copyright Sweet Potato Yiu April 28, 2018

http://www.cnblogs.com/fanshuyao/

Jquery Easyui combotree can only select leaf nodes and leaf nodes have multi-marquee