ComponentOne Extender Controls for ASP.NET Web Forms
Wijmo Control Toolkit Extender Controls / C1TreeExtender / Using Tree Node Checkboxes
In This Topic
    Using Tree Node Checkboxes
    In This Topic

    C1TreeExtender supports showing tree nodes with a checkbox.

    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.AllowEdit property and set it to true.
    5. Locate the C1TreeExtender.ShowCheckbox property and set it to true.
    6. Press F5 to run your application. The C1TreeExtender control should resemble the following image: