Ribbon
- 2 minutes to read
The ASPxRibbon control is a tabbed toolbar that allows you to place command items on different tabs.
<dx:ASPxRibbon ID="ASPxRibbon1" ...>
<Tabs>
<dx:RibbonTab Name="Home" Text="Home">
<Groups>
<dx:RibbonGroup Name="Clipboard" Text="Clipboard">
<Items>
<dx:RibbonButtonItem Name="Cut" Text="Cut" />
<dx:RibbonButtonItem Name="Copy" Text="Copy" />
</Items>
</dx:RibbonGroup>
</Groups>
</dx:RibbonTab>
<!-- Ribbon structure -->
</Tabs>
</dx:ASPxRibbon>
Common Concept
The ASPxRibbon control stores tabs in the Tabs collection. Each tab is a (RibbonTab) instance that contains groups (RibbonGroup) with items (RibbonItemBase) in the RibbonTab.Groups and RibbonGroup.Items collections.
Client-Side API
The ASPxRibbon‘s client-side API is implemented with JavaScript and exposed by the ASPxClientRibbon object.
Availability | Available by default. |
Client object type | |
Access name | |
Events |
<dx:ASPxRibbon ID="ASPxRibbon1" runat="server" ClientInstanceName="ribbon">
//...
</dx:ASPxRibbon>
function buttonClick(){
// Makes a tab with the specified index active.
ribbon.SetActiveTabIndex(2);
}
Features
Data-Bound Mode
The ribbon supports data-bound mode. You can obtain information about tabs, groups, and items from a data source.
Supported Item Types
The ribbon allows you to use different editors (button, text box, combo box, and so on) and galleries (gallery bar and drop-down gallery) as items.
Context Tabs
Context tabs combine different items into categories. These tabs appear on the ribbon when users select objects.
Template
You can provide a custom structure and content for the ribbon’s file tabs and items.
One-Line Mode
The ribbon can display all items within an active tab in one line to make the ribbon more compact.
