2

My treeveiw example

I want to keep my parent folder names uncheckable. but i can not pass the option with individual node here.

I wrote code like this.

$("#treeview-checkable").treeview({
        data: root.attributeTopicList,
        showIcon: true,
        showCheckbox: true,
        showBorder: false,
        showTags: true,
    });

};
Nope
  • 22,147
  • 7
  • 47
  • 72
Habibul Hasan
  • 103
  • 1
  • 13

2 Answers2

5

I had to Add some lines in bootstrapp-treeview.js file

Code looks like this

Process-->>

  • Go inside bootstrapp_treeview.js

  • See how its render function works

  • You will find that after treeview fire any event or make any changes on DOM it calls its render method
  • You will find render method in line number 486
  • If you write your code in such way that your parent node should not have checkbox just write

        for (var i = 0; i < $(".glyphicon-minus").length; i++)
        {
            $($(".glyphicon-minus")[i]).siblings(".check-icon").hide();
        }
        for (i = 0; i < $(".glyphicon-plus").length; i++){
            $($(".glyphicon-plus")[i]).siblings(".check-icon").hide();
        }
    
Habibul Hasan
  • 103
  • 1
  • 13
  • 1
    However, for (var i = 0; i < $(".expand-icon").length; i++) { $($(".expand-icon")[i]).siblings(".check-icon").hide(); } I found this shorter including only 1 for loop. Just replacing icon class with default treeview initialises class. – iamawesome Jun 25 '19 at 13:24
  • You can also use remove() to delete checkbox completely from dom – iamawesome Jun 25 '19 at 13:26
1

I encountered the same issue. In order to remove the checkbox from the upper most parent, I used a bit of a workaround.

After drawing the tree I tell it to find the data-nodeid=0 attribute and remove the check-icon classed span element.

So right after tree initializes I run this:

$("#treeview-checkable").find("[data-nodeid=0]").find(".check-icon").remove();

I also detected every click event on my page to do the same thing.

window.onclick = function(){
    $("#treeview-checkable").find("[data-nodeid=0]").find(".check-icon").remove();
};

I do the same thing on every click because I found when I expanded, collapsed, did anything to the tree, the checkbox re-appeared.

Is this the best solution? No. Does it work? Yes.

bucky310
  • 34
  • 4
  • 1
    i write some code on .js of its library file. :) in my case parent folders nodeid does not guarantied to be only "0" – Habibul Hasan Oct 25 '17 at 11:34
  • I see your solution below doesn't remove the checkbox. Just be careful with this as it can still be checked while hidden if you use their "checkAll" function. Otherwise, your solution works well. Sorry I didn't realize it was for all parents, thought it was just for the first. – bucky310 Oct 29 '17 at 14:49
  • 1
    Again , you can use those line on CheckAll function also. cause , after calling checkall , it will eventually call render function again and will use this lines of code by default. There is no chance to check the parent box at all. and in may case : I am not using checkall , that is the best solution i got so far – Habibul Hasan Oct 30 '17 at 06:11
  • No worries. Just wanted to make sure. – bucky310 Oct 30 '17 at 14:21