javascript - 如何从 Bootstrap TreeView 中实现 onNodeSelected 内的 ExpandNode?

标签 javascript jquery treeview bootstrap-treeview

Bootstrap TreeView 中的节点只能使用 + & - 前缀折叠/展开。我知道点击事件是为了不那么平凡的事情而保存的。我们确实使用点击事件将有关叶子的信息发送到页面的其他部分。

但我的客户想要的正是这个:单击 li 元素时折叠和展开。事实上,这更加用户友好和直观。

我在 GitHub 上找到了“expandNode”和“collapseNode”方法。

$('#tree').treeview('expandNode', [nodeId, {
  levels: 2,
  silent: true
}]);
$('#tree').treeview('collapseNode', [nodeId, {
  silent: true,
  ignoreChildren: false
}]);

现在我想直接从 onNodeSelected 事件调用它们,如下所示:

$('#treeview').treeview({
  data: data,
  multiSelect: true,
  highlightSelected: false,
  onNodeSelected: function(event, node) {
    if (node.nodes == undefined) {
      // sends node info to another element
    } else if (node.state.expanded) {
      // TODO collapse children 
      collapseNode(node.nodeId);
    } else {
      // TODO expand children 
      expandNode(node.nodeId);
    }
  }
});

function collapseNode(nodeId) {
  $('#tree').treeview('collapseNode', [nodeId]);
  alert("collapse " + nodeId);
}

function expandNode(nodeId) {
  $('#tree').treeview('expandNode', [nodeId]);
  alert("expand " + nodeId);
}

警报被触发并显示正确的节点 ID。但该节点未展开(或折叠)。 我错过了什么?

最佳答案

您在函数中选择了错误的 TreeView 。尝试将它们更新为以下内容:

function collapseNode(nodeId) {
  $('#treeview').treeview('collapseNode', [nodeId]);
  alert("collapse " + nodeId);
}

function expandNode(nodeId) {
  $('#treeview').treeview('expandNode', [nodeId]);
  alert("expand " + nodeId);
}

关于javascript - 如何从 Bootstrap TreeView 中实现 onNodeSelected 内的 ExpandNode?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41703462/

相关文章:

javascript - jQuery .reset 函数在粒子按钮单击下不起作用

javascript - 使用 TableFilter,如何更改下拉列表中的文本?

javascript - 将计数器添加到 HTML 表单并计算积分

javascript - 打破 .preventDefault()

c# - 如何使 TreeView 不可折叠?

javascript - 如何使图像按随机顺序循环播放?

javascript - 如何访问 XHR 对象使 backbone.model 保存

javascript - 如何在 WP7 中使用固定页脚定位 ·

delphi - Treeview 在运行时突出显示一个节点

c# - XAML Treeview,如何水平而不是垂直显示节点