Jstree-Can't在AJAX调用中选中复选框,适用于经典调用.一个问题

Jstree - Can't check checkboxes in AJAX call, works in classic call. An issue?

本文关键字:调用 经典 适用于 问题 一个 Jstree-Can AJAX 复选框      更新时间:2023-09-26

我做了一个AJAX调用来创建和填充我的JSTreediv。我激活了复选框插件,并尝试选中我的AJAX结果回调中的所有复选框。它不起作用。

我将相同的函数(将选中所有框)绑定到一个按钮上,在这里,它可以工作。

我还试着用jQuery通过自定义事件检查所有复选框,但它什么都没做,就像AJAX调用一样

这是JSTree的问题还是我遗漏了什么?

我在JsFiddle中转载了这期(?):https://jsfiddle.net/Lyyn/c74wpa6z/


规格:

  • jQuery 1.9.1
  • jsTree 3.2.1

代码

HTML

<h1>
JSTree Demo
</h1>
<button id="btn">
Check All
</button>
<div id="jstree">
</div>

JS

// Populate the tree with some generic data
$.ajax({
    // ... initial ajax code with some generic data
    success: function(response) {
            var $tree = $("#jstree");
            $tree.jstree(response);
        
        // Try to check all boxes, it doesn't work
        checkAll($tree);
    }
});
// Try to check all boxes, here it works. Why.
$("#btn").click(function(){
        checkAll($("#jstree"));
})
// This will check all boxes inside the tree
function checkAll(tree) {
        tree.jstree(true).check_all();
}

这是因为当您在成功回调中调用checkAll时,jstree还没有构建节点。只需将您的checkAll调用封装到ready.jstree事件中,如下所示。查看演示-Fiddle。

...
success: function(response) {
    var $tree = $("#jstree");
    $tree.jstree(response).on('ready.jstree', function() {
        // Try to check all boxes
        checkAll($tree);
});