esayui combotree 只能选择子节点

Posted 2020-12-04 feipengting

esayui combotree 只能选择子节点用onBeforeSelect：参数是node，节点被选中之前触发,返回false取消选择动作。

网上找了好多都没一个可用的，要想知道他是子节点还是根节点，我们先来看看combotree的数据结构：

                data:[{
                    "id":1,
                    "text":"My Documents",
                    "children":[{
                        "id":11,
                        "text":"Photos",
                        "state":"closed",
                        "children":[{
                            "id":111,
                            "text":"Friend"
                        },{
                            "id":112,
                            "text":"Wife"
                        },{
                            "id":113,
                            "text":"Company"
                        }]
                    },{
                        "id":12,
                        "text":"Program Files",
                        "children":[{
                            "id":121,
                            "text":"Intel"
                        },{
                            "id":122,
                            "text":"Java",
                            "attributes":{
                                "p1":"Custom Attribute1",
                                "p2":"Custom Attribute2"
                            }
                        },{
                            "id":123,
                            "text":"Microsoft Office"
                        },{
                            "id":124,
                            "text":"Games",
                            "checked":true
                        }]
                    },{
                        "id":13,
                        "text":"index.html"
                    },{
                        "id":14,
                        "text":"about.html"
                    },{
                        "id":15,
                        "text":"welcome.html"
                    }]
                }]

id是用来分级的，根节点有children，而子节点没有children。那我们就有这个children 来区分是不是根节点。

具体代码如下：

            $("#easyui-tree").tree({
                "data": data,
                "onSelect": onSelect,
                "onBeforeSelect": function (node) {
                    var rows = node.children;
                    //选中的节点是否为叶子节点,如果不是叶子节点,清除选中
                    if (rows != null) {
                        return false;
                    } else
                        return true;
                }
            });

之前还有一个问题是后端传过来的json字符串直接放到"data":这个参数上一直加载不了树，后面才想起来必须系列化成JSON，就是 var data =json字符串；var dataJson=$.parseJSON(data);

这个问题容易被忽略所以提醒一下。