设置jsTree节点到"未确定"州节点、jsTree、QUOT

2023-09-11 01:04:48 作者:太深刻i

我使用 jsTree 显示与复选框的树。节点的每个级别使用 json_data 插件加载点播。

I'm using jsTree to show a tree with checkboxes. Each level of nodes is loaded on-demand using the json_data plugin.

如果一个节点的后代被选中,那么这个节点应该在一个不确定状态(如ACME和美国)。

If a node's descendent is checked, then that node should be in an "undetermined state" (like ACME and USA).

现在的问题是,树上开出崩溃。 ACME看起来选中,但应的是待定。当我终于扩展到一个检查点,jsTree实现的祖先应该是未定

The problem is, the tree starts out collapsed. ACME looks unchecked but should be undetermined. When I finally expand to a checked node, jsTree realizes the ancestors should be undetermined.

所以,我需要能够把一个复选框中的待定状态,而不会加载它的孩子。

So I need to be able to put a checkbox in the undetermined state without loading its children.

使用 jsTree 则可以$ P $添加 jstree-检查类的P-检查框<李> 。我尝试添加了 jstree-未确定类,但它不工作。它只是使他们处于选中状态。

With jsTree you can pre-check a box by adding the jstree-checked class to the <li>. I tried adding the jstree-undetermined class, but it doesn't work. It just puts them in a checked state.

下面是我的code:

$("#tree").jstree({
    plugins: ["json_data", "checkbox"],
    json_data: {
        ajax: {
            url: '/api/group/node',
            success: function (groups) {
                var nodes = [];
                for (var i=0; i<groups.length; i++) {
                    var group = groups[i];

                    var cssClass = "";
                    if(group.isSelected)
                        cssClass = "jstree-checked";
                    else if(group.isDecendantSelected)
                        cssClass = "jstree-undetermined";

                    nodes.push({
                        data: group.name,
                        attr: { 'class': cssClass }
                    });
                }
                return nodes;
            }
        }
    }
})

我的问题

如何设置一个节点到待定状态?

My Question

How do I set a node to the undetermined state?

推荐答案

我有同样的问题,我发现是解决这一个:

I had the same problem and the solution I found was this one:

var tree = $("#tree").jstree({
    plugins: ["json_data", "checkbox"],
    json_data: {
        ajax: {
            url: '/api/group/node',
            success: function(groups) {
                var nodes = [];
                for (var i = 0; i < groups.length; i++) {
                    var group = groups[i];
                    var checkedState = "false";
                    if (group.isSelected)
                        checkedState = "true";
                    else if (group.isDecendantSelected)
                        checkedState = "undetermined";
                    nodes.push({
                        data: group.name,
                        attr: { 'checkedNode': checkedState }
                    });
                }
                return nodes;
            },
            complete: function () {
                $('li[checkedNode="undetermined"]', tree).each(function () {
                    $(this).removeClass('jstree-unchecked').removeClass('jstree-checked').addClass('jstree-undetermined');
                });
                $('li[checkedNode="true"]', tree).each(function () {
                    $(this).removeClass('jstree-unchecked').removeClass('jstree-undetermined').addClass('jstree-checked');
                });
                $('li[checkedNode="false"]', tree).each(function () {
                    $(this).removeClass('jstree-checked').removeClass('jstree-undetermined').addClass('jstree-unchecked');
                });
            }
        }
    }
});

希望它可以帮助你!

Hope it helps you!