ComponentOne Extender Controls for ASP.NET Web Forms
Wijmo Control Toolkit Extender Controls / C1TreeExtender / Setting the Auto Collapse Option
In This Topic
    Setting the Auto Collapse Option
    In This Topic

    You can set the C1TreeExtender control so that the open nodes will automatically collapse when another node is opened.

    Complete these steps:

    1. Create a new ASP.NET Web Application.
    2. In the Visual Studio Toolbox, double-click on a standard Panel control to add it to the main content of your page.
    3. Add the following markup within the <asp:Panel> tags to create the list that will become the tree.

    <ul>

    <li class="folder"><a><span>Folder 1</span></a>

          <ul>

          <li class="folder"><a><span>Folder 1.1</span></a>

          <ul>

          <li class="file"><a><span>File 1.1</span></a></li>

          <li class="file"><a><span>File 1.2</span></a></li>

          <li class="file"><a><span>File 1.3</span></a></li>

          <li class="file"><a><span>File 1.4</span></a></li>

          <li class="file"><a><span>File 1.5</span></a></li>

                            </ul>

                        </li>

          <li class="file"><a><span>File 1.2</span></a></li>

          <li class="file"><a><span>File 1.3</span></a></li>

          <li class="file"><a><span>File 1.4</span></a></li>

          <li class="file"><a><span>File 1.5</span></a></li>

                    </ul>

                </li>

          <li class="folder"><a><span>Folder 2</span></a>

          <ul>

          <li class="file"><a><span>File 2.1</span></a></li>

          <li class="file"><a><span>File 2.2</span></a></li>

          <li class="file"><a><span>File 2.3</span></a></li>

          <li class="file"><a><span>File 2.4</span></a></li>

          <li class="file"><a><span>File 2.5</span></a></li>

                    </ul>

                </li>

          <li class="folder"><a><span>Folder 3</span></a>

                    <ul>

          <li class="file"><a><span>File 3.1</span></a></li>

          <li class="file"><a><span>File 3.2</span></a></li>

          <li class="file"><a><span>File 3.3</span></a></li>

          <li class="file"><a><span>File 3.4</span></a></li>

          <li class="file"><a><span>File 3.5</span></a></li>

                    </ul>

                </li>

            </ul>

    1. Use the Panel control's smart tag to open the Extender Wizard by clicking Add Extender.
    2. Select the C1TreeExtender from the list and click OK to add it to the application.
    3. Select View | Properties from the Visual Studio menu and use the drop-down list at the top of the Properties window to select Panel1_C1TreeExtender.
    4. Locate the C1TreeExtender.AutoCollapse property and set it to true.
    5. Press F5 to run your application. Note that the C1TreeExtender.AutoCollapse property will not allow two nodes to be open at one time.