Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

avoid treeview collapse on click of treeview text in jquery

I need to avoid the collapse of jquery treeview on click of treeview links/text.

For example, if i am showing a list of directories/subdirectories in treeview, I need to collapse the treeview only while clicking the +/- image and not on clicking the directories

like image 714
Prasad Avatar asked Dec 30 '22 06:12

Prasad


1 Answers

You'll need to update the treeview javascript code itself. For Treeview 1.4, comment out the following lines (66-68):

this.filter(":has(>ul):not(:has(>a))").find(">span").click(function(event) {
    toggler.apply($(this).next());
}).add( $("a", this) ).hoverClass();

This will ensure expand/collapse only occurs on the +/- click. The expand all and collapse all feature will continue to work as well, if applicable.

Better yet, you provide a new argument when defining the tree and only if the condition is satisfied do you override the default functionality. For example,

if (settings.expandMode != 'simple'){
    this.filter(":has(>ul):not(:has(>a))").find(">span").click(function(event) {
        toggler.apply($(this).next());
    }).add( $("a", this) ).hoverClass();
}

And your treeview definition might look like this:

$("#tree").treeview({
    animated: "fast",
    persist: "cookie",
    collapsed: true,
    control: "#treecontrol",
    expandMode: "simple" // custom - only toggles per the +/- icon      
})

Hopefully you get the idea. Good luck.

like image 59
Ben Griswold Avatar answered Feb 15 '23 03:02

Ben Griswold