I'm using bootstrap-treeview to display a tree-like view of my data. The initial and basic implementation is working but I need it to when I click the text value, i get redirected to the link.

The JS function that renders the tree is:

function initTree(treeData) {
    $('#treeview_json').treeview({
        data: treeData,
        enableLinks: true
    });
    // collapses all nodes
    $('#treeview_json').treeview('collapseAll', { silent: true });
}

The enableLinks: true node property renders the link. But I could not find any documentation or example on the href property.

Does the link has to be supplied with the data or can it be built by the javascript?

I'm using bootstrap-treeview to display a tree-like view of my data. The initial and basic implementation is working but I need it to when I click the text value, i get redirected to the link.

The JS function that renders the tree is:

function initTree(treeData) {
    $('#treeview_json').treeview({
        data: treeData,
        enableLinks: true
    });
    // collapses all nodes
    $('#treeview_json').treeview('collapseAll', { silent: true });
}

The enableLinks: true node property renders the link. But I could not find any documentation or example on the href property.

Does the link has to be supplied with the data or can it be built by the javascript?

• javascript
• twitter-bootstrap-3
• treeview

Share Improve this question Follow asked Mar 5, 2018 at 10:54 gtludwiggtludwig 5,6311313 gold badges6969 silver badges9696 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

You pass href as node attribute (see https://github./jonmiles/bootstrap-treeview#node-properties), so it is supplied with the data:

var tree = [
  {
    text: "Parent 1",
    nodes: [
      {
        text: "Child 1",
        nodes: [
          {
            text: "Google",
            href: "https://www.google."
          },
          {
            text: "Twitter",
            href: "https://www.twitter."
          }
        ]
      },
      {
        text: "Facebook",
        href: "https://www.facebook."
      }
    ]
  }
];

Check this example: https://jsfiddle/beaver71/bvpncxko/

Remember you must have enableLinks:true

function initTree(treeData) {
        $('#treeview_json').treeview({
            data: treeData,
            enableLinks: true,
        });
    }