Menu & Split button

Using ButtonType="Menu" or ButtonType="Split", you have a menu-like button, from which you can choose one item, and perform an action. The main difference between the two is that the Split button has a default option.

Each option in the menu or split button can be added using the MenuButtonItem class. You can add an unlimited number of nested MenuButtonItem. You alyaws need to provide a Text and a Value.

Here are some nice things you can accomplish with the MenuButtonItem class:

• Postback on option click - this is the default behaviour. The Click event on the server will give you access to the MenuButtonItem that was clicked.
• Execute a client side function - you can set the OnClientClick property to the name of your function. In this method, you can cancel the postback by setting the args.cancel variable to false(args is the second parameter passed to your function, the first being the instance of the client Button instance).
• Make the option act as a HyperLink - just set the NavigateUrl property.
• Check some items - you can accomplish this by setting the Checked property to true.
• Disable some items - to do this, just set the Enabled property to false.
• Customize the appearance of the item - this can be done using thee CssClass property, to assign a css class to the item.

		<yui:Button ID="btnSplit" Text="<i>Here is a </i> <b>split button</b>" 
          ButtonType="Split" runat="server">
        <Items>
            <yui:MenuButtonItem Text="Custom script" Value="0" OnClientClick="tell" />
            <yui:MenuButtonItem Text="Option 1" Value="1" />
            <yui:MenuButtonItem Text="Option 2" Value="2" />
            <yui:MenuButtonItem Text="Checked item" Value="3" Checked="true" />
            <yui:MenuButtonItem Text="Selected item" Value="4" Selected="true" />
            <yui:MenuButtonItem Text="Disabled item" Value="5" Enabled="false" />
            <yui:MenuButtonItem Text="YUIAsp.Net" Target="_blank" 
                NavigateUrl="http://www.YUIAsp.Net" />
            <yui:MenuButtonItem Text="Custom css class" Value="6" CssClass="customCssItem" />
        </Items>
    </yui:Button>