CODEWITHSUNDEEP
jqueryjquery-pluginstreeview
Ben Griswold
Ben Griswold

Reputation: 18321

How Do I Create Expand All and Collapse All Links Outside of the jQuery Treeview Plugin?

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.

Upvotes: 1

Views: 1437

Answers (2)

altrugon
altrugon

Reputation: 1

Try:

$(".treeview").treeview({  // ".treeview" is your selector
  control: "#treecontrol", // this is your controller
  persist: "cookie",
  cookieId: "treeview-black"
});

That will close every single list with class "treeview" every time you click the "Collapse All" under the div#treecontrol.

Upvotes: 0

Mottie
Mottie

Reputation: 86413

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" })

Upvotes: 2

Related Questions