blazor-devexpress-dot-blazor-dot-dxribbon-46df7a70.md
Specifies the index of the active Ribbon tab.
Namespace : DevExpress.Blazor
Assembly : DevExpress.Blazor.v25.2.dll
NuGet Package : DevExpress.Blazor
[DefaultValue(0)]
[Parameter]
public int ActiveTabIndex { get; set; }
| Type | Default | Description |
|---|---|---|
| Int32 | 0 |
A zero-based index of the Ribbon tab.
|
The ActiveTabIndex property value is between zero (the first tab) and the total number of Ribbon tabs minus one (the last tab).
To handle changes to the active tab, use the ActiveTabIndexChanged event.
The following example updates the content area when a user selects a tab:
<DxRibbon @bind-ActiveTabIndex="ActiveTabIndex">
<DxRibbonTab Text="Home">
<DxRibbonGroup Text="File">
<DxRibbonItem Text="New" IconCssClass="dx-icon-file" />
<DxRibbonItem Text="Save" IconCssClass="dx-icon-save" />
</DxRibbonGroup>
<DxRibbonGroup Text="Clipboard">
<DxRibbonItem Text="Cut" IconCssClass="dx-icon-cut" />
<DxRibbonItem Text="Copy" IconCssClass="dx-icon-copy" />
<DxRibbonItem Text="Paste" IconCssClass="dx-icon-paste" />
</DxRibbonGroup>
</DxRibbonTab>
<DxRibbonTab Text="Format">
<DxRibbonGroup Text="Align">
<DxRibbonItem Text="Left" IconCssClass="dx-icon-alignleft" />
<DxRibbonItem Text="Center" IconCssClass="dx-icon-aligncenter" />
<DxRibbonItem Text="Right" IconCssClass="dx-icon-alignright" />
</DxRibbonGroup>
</DxRibbonTab>
</DxRibbon>
<p>Active tab index: <b>@ActiveTabIndex</b></p>
@code {
int ActiveTabIndex { get; set; } = 0;
}
See Also