Question

The jQuery Treeview Plugin adds Collapse All, Expand All and Toggle All links to the “treeviewcontrol” div when the control property is defined as follows:

$("#black, #gray").treeview({
   control: "#treecontrol",
   persist: "cookie",
   cookieId: "treeview-black"
});

This works great, but I’d like the ability to expand and collapse the treeview from other page elements outside of the treeview itself. I’ve looked at the source, but I can’t figure it out.

Answer 1

If you check out the demo page here you can see there is a div#treecontrol, well just make it a treecontrol class:

<div class="treecontrol">
 <a title="Collapse the entire tree below" href="#"><img src="../images/minus.gif" /> Collapse All</a>
 <a title="Expand the entire tree below" href="#"><img src="../images/plus.gif" /> Expand All</a>
 <a title="Toggle the tree below, opening closed branches, closing open branches" href="#">Toggle All</a>
</div>

Then you can make as many copies of this control and put them anywhere you want. Don’t forget to modify the control parameter:

$("#tree").treeview({ control: ".treecontrol" })