JavaScript (ES5)
EditEdit This DocumentInstall NuGet
Demos
Support
Forum
FREE TRIAL
Search results

Ribbon API in JavaScript (ES5) Spreadsheet API control

Represents Ribbon component.

Properties

cssClass

string

Defines class/multiple classes separated by a space in the Spreadsheet element.

Defaults to ""

enablePersistence

boolean

Enable or disable persisting component’s state between page reloads.

Defaults to false

enableRtl

boolean

Enable or disable rendering component in right to left direction.

Defaults to false

items

RibbonItemModel[]

An array of object that is used to configure the Ribbon tab.

Defaults to []

locale

string

Overrides the global culture and localization value for this component. Default global culture is ‘en-US’.

Defaults to ”

An array of object that is used to configure the Ribbon menu.

Defaults to []

Used the specify the ribbon menu type as Menu or Sidebar.

Defaults to true

selectedTab

number

Specifies the index for activating the current Ribbon tab.

Defaults to 0

Methods

addEventListener

Adds the handler to the given event listener.

Parameter Type Description
eventName string A String that specifies the name of the event
handler Function Specifies the call to run when the event occurs.

Returns void

addMenuItems

To add custom menu items.

Parameter Type Description
items MenuItemModel Specifies the Ribbon menu items to be inserted.
text string Specifies the existing file menu item text before / after which the new file menu items to be inserted.
insertAfter boolean Set false if the items need to be inserted before the text.
By default, items are added after the text.
isUniqueId (optional) boolean Set true if the given menu items text is a unique id.

Returns void

addTabs

To add custom tabs.

Parameter Type Description
items RibbonItemModel[] Specifies the Ribbon tab items to be inserted.
insertBefore (optional) string Specifies the existing Ribbon header text before which the new tabs will be inserted.
If not specified, the new tabs will be inserted at the end.

Returns void

addToolbarItems

To add the custom items in Ribbon toolbar.

Parameter Type Description
tab string Specifies the ribbon tab header text under which the specified items will be inserted..
items ItemModel Specifies the ribbon toolbar items that needs to be inserted.
index (optional) number Specifies the index text before which the new items will be inserted.

Returns void

appendTo

Appends the control within the given HTML element

Parameter Type Description
selector (optional) string | HTMLElement Target element where control needs to be appended

Returns void

attachUnloadEvent

Adding unload event to persist data when enable persistence true

Returns void

dataBind

When invoked, applies the pending property changes immediately to the component.

Returns void

destroy

Destroys the component (detaches/removes all event handlers, attributes, classes, and empties the component element).

    <div id="spreadsheet"></div>
    <button id="apply-button">Destroy Spreadsheet</button>
import { Spreadsheet } from '@syncfusion/ej2-spreadsheet';

let spreadsheet: Spreadsheet = new Spreadsheet();

spreadsheet.appendTo('#spreadsheet');

document.getElementById("apply-button").onclick = () => {
    spreadsheet.destroy();
};

Returns void

detachUnloadEvent

Removing unload event to persist data when enable persistence true

Returns void

enableItems

Enables or disables the specified Ribbon toolbar items or all ribbon items.

Parameter Type Description
tab string Specifies the ribbon tab header text under which the toolbar items need to be enabled / disabled.
items (optional) number[] | string[] Specifies the toolbar item indexes / unique id’s which needs to be enabled / disabled.
If it is not specified the entire toolbar items will be enabled / disabled.
enable (optional) boolean Boolean value that determines whether the toolbar items should be enabled or disabled.

Returns void

enableMenuItems

To enable / disable the ribbon menu items.

Parameter Type Description
items string[] Items that needs to be enabled / disabled.
enable boolean Set true / false to enable / disable the menu items.
isUniqueId (optional) boolean Set true if the given menu items text is a unique id.

Returns void

enableTabs

To enable / disable the Ribbon tabs.

Parameter Type Description
tabs string[] Specifies the tab header text which needs to be enabled / disabled.
enable boolean Set true / false to enable / disable the ribbon tabs.

Returns void

getLocalData

Returns the persistence data for component

Returns any

getRootElement

Returns the route element of the component

Returns HTMLElement

handleUnload

Handling unload event to persist data when enable persistence true

Returns void

hideMenuItems

To show/hide the menu items in Ribbon.

Parameter Type Description
items string[] Specifies the menu items text which is to be show/hide.
hide boolean Set true / false to hide / show the menu items.
isUniqueId (optional) boolean Set true if the given menu items text is a unique id.

Returns void

hideTabs

To show/hide the Ribbon tabs.

Parameter Type Description
tabs string[] Specifies the tab header text which needs to be shown/hidden.
hide boolean Set true / false to hide / show the ribbon tabs.

Returns void

hideToolbarItems

To show/hide the existing Ribbon toolbar items.

Parameter Type Description
tab string Specifies the ribbon tab header text under which the specified items need to be hidden / shown.
indexes number[] Specifies the toolbar indexes which needs to be shown/hidden from UI.
hide boolean Set true / false to hide / show the toolbar items.

Returns void

refresh

Applies all the pending property changes and render the component again.

Returns void

removeEventListener

Removes the handler from the given event listener.

Parameter Type Description
eventName string A String that specifies the name of the event to remove
handler Function Specifies the function to remove

Returns void

Inject

Dynamically injects the required modules to the component.

Parameter Type Description
moduleList Function[] ?

Returns void

Events

beforeClose

EmitType<BeforeOpenCloseMenuEventArgs>

Triggers before closing the file menu.

beforeFileMenuItemRender

EmitType<MenuEventArgs>

Triggers while rendering each file menu item.

beforeOpen

EmitType<BeforeOpenCloseMenuEventArgs>

Triggers before opening the file menu.

clicked

EmitType<ClickEventArgs>

Triggers while clicking the ribbon content elements.

created

EmitType<Event>

Triggers once the component rendering is completed.

expandCollapse

EmitType<ExpandCollapseEventArgs>

Triggers once the component rendering is completed.

fileMenuItemSelect

EmitType<MenuEventArgs>

Triggers while selecting the file menu item.

selecting

EmitType<SelectingEventArgs>

Triggers while selecting the tab item.

Previous
Next