avoid treeview collapse on click of treeview text in jquery

jquery, treeview

Solution

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.

Problem

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`

Original source