Twitter Bootstrap TreeView 插件 [英] Twitter Bootstrap TreeView Plugin

问题描述

有谁知道一个成熟的 twitter bootstrap 树视图插件?到目前为止我发现的大多数东西是

Does anyone know a mature plugin for a treeview in twitter bootstrap? Most things i found so far are

a) 不再维护

b) 看起来很丑/有小故障

b) looking ugly / have glitches

c) 不能从 html 无序列表中初始化

c) can't be initialized from a html unordered list

d) 不允许元素(节点 或 叶)被选中.

d) don't allow an element (node or leaf) to become selected.

基本上我需要它来实现类似于文件浏览器的东西，但用于电子商务产品目录.

Basically i need this to implement something similar to a file-explorer, but for an eCommerce Product catalog.

提前致谢！

推荐答案

看看 FuelUX 树

var treeDataSource = new DataSource({
  data: [
    { name: 'Test Folder 1', type: 'folder', additionalParameters: { id: 'F1' } },
    { name: 'Test Folder 2', type: 'folder', additionalParameters: { id: 'F2' } },
    { name: 'Test Item 1', type: 'item', additionalParameters: { id: 'I1' } },
    { name: 'Test Item 2', type: 'item', additionalParameters: { id: 'I2' } },
    { name: 'Test Item 3', type: 'item', additionalParameters: { id: 'I3' } }
  ],
  delay: 400
});

$('#MyTree').tree({dataSource: treeDataSource});

$('#MyTree').tree({dataSource: treeDataSource});

这是一个带有数据源的工作示例:http://bootply.com/60761

Here is a working example with data source: http://bootply.com/60761

如果您希望文件夹或项目可供选择，您需要查看控件公开的方法/事件.

If you want a folder or item to be selectable, you'll need to look at the methods/events exposed by the control.

这篇关于Twitter Bootstrap TreeView 插件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！