花式树,点击不同的节点自动折叠其他选定的节点和子节点



我在Jquery对话框中渲染了一个由Fancy Tree转换的列表。我注意到,如果我选择一个子节点并关闭树意味着取消展开它的父节点并关闭对话框。当我单击另一个节点重新打开对话框时,我看到另一个选中的节点将自动展开,然后取消展开。

$("#errorCodes").fancytree({
    activeVisible: false, // Make sure, active nodes are visible (expanded).
    aria: false, // Enable WAI-ARIA support.
    autoActivate: false, // Automatically activate a node when it is focused (using keys).
    autoCollapse: false, // Automatically collapse all siblings, when a node is expanded.
    autoScroll: false, // Automatically scroll nodes into visible area.
    clickFolderMode: 3, // 1:activate, 2:expand, 3:activate and expand, 4:activate (dblclick expands)
    checkbox: false, // Show checkboxes.
    debugLevel: 0, // 0:quiet, 1:normal, 2:debug
    disabled: false, // Disable control
    generateIds: false, // Generate id attributes like <span id='fancytree-id-KEY'>
    idPrefix: "ft_", // Used to generate node id´s like <span id='fancytree-id-<key>'>.
    icons: false, // Display node icons.
    keyboard: true, // Support keyboard navigation.
    keyPathSeparator: "/", // Used by node.getKeyPath() and tree.loadKeyPath().
    minExpandLevel: 1, // 1: root node is not collapsible
    selectMode: 1, // 1:single, 2:multi, 3:multi-hier
    tabbable: false, // Whole tree behaves as one single control
    titlesTabbable: false // Node titles can receive keyboard focus
});
errorTree = $("#errorCodes").fancytree("getTree");
$("input[name=searchErrors]").keyup(function (e) {
    var match = $(this).val();
    if (e && e.which === $.ui.keyCode.ESCAPE || $.trim(match) === "") {
        $("button#btnResetSearchErrors").click();
        return;
    }
    var n = errorTree.applyFilter(match);
    $("button#btnResetSearchErrors").attr("disabled", false);
    $("span#matchesErrors").text("(" + n + " Results)");
}).focus();
$("button#btnResetSearchErrors").click(function (e) {
    $("input[name=searchErrors]").val("");
    $("span#matchesErrors").text("");
    errorTree.clearFilter();
}).attr("disabled", true);
$("input#hideModeErrors").change(function (e) {
    errorTree.options.filter.mode = $(this).is(":checked") ? "hide" : "dimm";
    errorTree.clearFilter();
    $("input[name=searchErrors]").keyup();
});

我通过下载最新版本的FancyTree(2.3.0)解决了这个问题。问题是,当单击一个节点并选中它时,它会变成活动行。因此,如果要展开另一个根节点,它会自动展开活动行所在的节点。

最新更新