ComponentOne Extender Controls for ASP.NET Web Forms
Wijmo Control Toolkit Extender Controls / C1MenuExtender / Setting Menu Functions
In This Topic
    Setting Menu Functions
    In This Topic

    The C1MenuExtender control allows you to set certain events.

    1. Create an ASP.NET Web application.
    2. Add a standard Panel control to the main content of  your page.
    3. Add the following markup within the <asp:Panel> tags to create a list that will become the menu.

    <ul id="menu1">

                <li><a href="#">MenuItem</a></li>

                <li><a href="#">Breaking News</a>

                    <ul>

                        <li class="header">

                            <h3>

                                header2</h3>

                        </li>

                        <li class="separator">s1</li>

                        <li><a href="#">Entertainment</a></li>

                        <li><a href="http://www.w3schools.com/tags/html5.asp">Politics</a></li>

                        <li><a href="#">A&amp;E</a></li>

                        <li><a href="#">Sports</a> </li>

                        <li><a href="#">Local</a></li>

                        <li><a href="#">Health</a></li>

                    </ul>

                </li>

                <li><a href="#">Entertainment</a>

                    <ul>

                        <li><a href="#">Celebrity news</a></li>

                        <li><a href="#">Gossip</a></li>

                        <li><a href="#">Movies</a></li>

                        <li><a href="#">Music</a>

                            <ul>

                                <li><a href="#">Alternative</a></li>

                                <li><a href="#">Country</a></li>

                                <li><a href="#">Dance</a></li>

                                <li><a href="#">Electronica</a></li>

                                <li><a href="#">Metal</a></li>

                                <li><a href="#">Pop</a></li>

                                <li><a href="#">Rock</a>

                                    <ul>

                                        <li><a href="#">Bands</a>

                                            <ul>

                                                <li><a href="#">Dokken</a></li>

                                            </ul>

                                        </li>

                                        <li><a href="#">Fan Clubs</a></li>

                                        <li><a href="#">Songs</a></li>

                                    </ul>

                                </li>

                            </ul>

                        </li>

                        <li><a href="#">Slide shows</a></li>

                        <li><a href="#">Red carpet</a></li>

                    </ul>

                </li>

                <li><a href="#">Finance</a>

                    <ul>

                        <li><a href="#">Personal</a>

                            <ul>

                                <li><a href="#">Loans</a></li>

                                <li><a href="#">Savings</a></li>

                                <li><a href="#">Mortgage</a></li>

                                <li><a href="#">Debt</a></li>

                            </ul>

                        </li>

                        <li><a href="#">Business</a></li>

                    </ul>

                </li>

                <li><a href="#">Food &#38; Cooking</a>

                    <ul>

                        <li><a href="#">Breakfast</a></li>

                        <li><a href="#">Lunch</a></li>

                        <li><a href="#">Dinner</a></li>

                        <li><a href="#">Dessert</a>

                            <ul>

                                <li><a href="#">Dump Cake</a></li>

                                <li><a href="#">Doritos</a></li>

                                <li><a href="#">Both please.</a></li>

                            </ul>

                        </li>

                    </ul>

                </li>

                <li><a href="#">Lifestyle</a></li>

                <li><a href="#">News</a></li>

                <li><a href="#">Politics</a></li>

                <li><a href="#">Sports</a></li>

                <li><a href="#">Novels</a></li>

                <li><a href="#">Magazine</a></li>

                <li><a href="#">Books</a></li>

                <li><a href="#">Education</a></li>

            </ul>

    1. Click the Panel smart tag and select Add Extender from the Tasks menu.
    2. In the Extender Wizard, select C1MenuExtender and click OK. A C1MenuExtender control is added to the page and the TargetControlID is set to Panel1.
    3. Select View | Properties Window in the Visual Studio menu.
    4. Click the drop-down list at the top of the Properties window and select Panel1_C1MenuExtender.
    5. Set the C1MenuExtender.Orientation property to Vertical.
    6. Press F5 to run the application. The menu appears vertically rather than horizontally.