Question

我遇到了这个问题，我正在使用asp和jstree复选框插入，我需要获得所有节点而不是选择（父母和他的孩子），首选数组上的完整路径然后拆分它，因为我需要做搜索数据库，我需要父母和孩子。

这是我的代码：

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>

    <link href="jstree-bootstrap-theme-master/dist/libs/bootstrap/css/bootstrap-theme.min.css" rel="stylesheet" />
    <link href="jstree-bootstrap-theme-master/dist/libs/bootstrap/css/bootstrap.min.css" rel="stylesheet" />

    <link href="jstree-bootstrap-theme-master/dist/themes/proton/style.min.css" rel="stylesheet" />

    <script src="https://code.jquery.com/jquery-1.11.0.min.js"></script>
    <script src="jstree-bootstrap-theme-master/dist/libs/bootstrap/js/bootstrap.min.js"></script>
    <script src="jstree-bootstrap-theme-master/dist/jstree.min.js"></script>
    
</head>
<body>

    <div id="container">
        <ul>
            <li>Root node
      <ul>
          <li id="child_node">Child node</li>
      </ul>
            </li>
        </ul>
    </div>

    <button type="button" class="btn btn-primary" id="getChecked">Botón normal</button>
    




    <script type="text/javascript">
        $('#container').jstree({
            'plugins': ["wholerow", "checkbox"],
            'core': {
                'data': [{
                    "text": "RRRAAAA",
                    "children": [
                        {
                            "text": "S1",
                            "icon": "glyphicon glyphicon-chevron-right",
                            "state": {
                                "selected": false
                            }
                        },
                    {
                        "text": "S2",
                        "icon": "glyphicon glyphicon-chevron-right"
                    },
                    {
                        "text": "A2",
                        "icon": "glyphicon glyphicon-chevron-right"
                    },
                    {
                        "text": "A2",
                        "icon": "glyphicon glyphicon-chevron-right"
                    },
                    {
                        "text": "F",
                        "icon": "glyphicon glyphicon-chevron-right"
                    }]
                }],
                'themes': {
                    'name': 'proton',
                    'responsive': true
                }
            }
        }).on('select_node.jstree', function (e, data) {
        var i, j, nid;

        for (i = 0, j = data.selected.length; i < j; i++) {
            nid = data.instance.get_node(data.selected[i]).id;

            alert(nid);

        }
    }); 
      
      
      

        $(function () {

            $("#getChecked").click(function () {

                $("#tree").jstree("get_checked", null, true).each(function (i, e) {
                    console.log($(this).attr("id"));
                    alert($(this).attr("id"));
                });
            });

        });
    </script>

</body>
</html>

Answer 1

在Jstree中有2个类可用于区分节点检查和未检查状态。它们分别是'jstree-checked'和'jstree-unchecked'

因此，为了获得未选中的所有节点，您可以使用以下逻辑

 var nodeCheckedCount= $('.jstree-unchecked').length;     
 var Ids = '';
        if (nodeCheckedCount=  > 0) {
            for (i = 0; i < nodeCheckedCount= ; i++) {
                var temp = $($('.jstree-unchecked')[i]).attr('id')
                if (Ids  == "") {
                    Ids  += temp;
                }
                else {
                    Ids= Ids + "," + temp;
                }
            }
console.log(Ids)

Answer 2

实际上这个代码工作，但不是我想要的，我需要la完整路径，但我需要在点击按钮时选择所有节点。在这段代码中，我遇到了麻烦，因为当检查父级时，向我显示警报但没有显示所有子节点的完整路径，只需重复显示警报多次但不是完整路径;当我检查每个节点时，完整路径有效。

.on('select_node.jstree', function (e, data) {
        var selectedNodes = $('#container').jstree(true).get_selected();
        for (var node in selectedNodes) {
            var path = $('#container').jstree(true).get_path(data.node, "/");
            alert(path);
        }         
    });

ASP.NET jstree复选框获取所有选定的节点和子节点

2 个答案: