Server Side Events

27 Sep 20174 minutes to read

The server side events for the Ribbon control are as follows.

Event Description Arguments
OnServerTabSelect The event is triggered when the Ribbon tab gets selected. The selected items are passed as arguments. Arguments:
  1. Current Tab Index: Selected tab Index.
  2. Previous tab Index: Previous Active Tab Index

OnServerGroupClick
The event is triggered when the Ribbon Group gets clicked. The selected items are passed as arguments. Arguments:
  1. Control ID: selected group ID.
  2. Ribbon model.

OnServerGalleryItemClick
The event is triggered when the gallery items get clicked. The selected items are passed as arguments. Arguments:
  1. Control ID: selected gallery Item ID.
  2. Gallery model.

The following code example demonstrates how to handle the TabSelect event to get the selected tab information.

  • HTML
  • <ej:Ribbon ID="Ribbon" runat="server" Width="100%" OnServerTabSelect="OnTabSelect">
    
            <ApplicationTab MenuItemID="menu" Type="Menu"/>
    
            </ApplicationTab>
    
            <RibbonTabs>
    
                <ej:RibbonTab Id="home" Text="HOME">
    
                    <TabGroupCollection>
    
                        <ej:TabGroup Text="New" AlignType="rows">
    
                            <ContentCollection>
    
                                <ej:TabContent>
    
                                    <ContentGroupCollection>
    
                                        <ej:ContentGroup Id="New" Text="New" Type="Button">
    
                                          <ButtonSettings Type="Button" ContentType="ImageOnly" ImagePosition="ImageTop" PrefixIcon="e-icon e-ribbon e-new" Click="executeAction" />
    
                                        </ej:ContentGroup>
    
                                    </ContentGroupCollection>
    
                                    <ContentDefaults Width="60" Height="70" Type="Button" />
    
                                </ej:TabContent>
    
                            </ContentCollection>
    
                        </ej:TabGroup>
    
                    </TabGroupCollection>
    
                </ej:RibbonTab>
    
            </RibbonTabs>
    
        </ej:Ribbon>
    
    <ul id="menu">
    
    <li><a>FILE</a></li>
    
    </ul>

    Add the following code example in code behind.

  • C#
  • protected void OnTabSelect(object sender, RibbonEventArgs e)
    
            {
    
                Label1.Text = "Ribbon Tab"+e.CurrentTabIndex+" is Selected"; //Ribbon Tab1 is Selected.
    
            }