Category / Section
How to hide and show the file menu in the Spreadsheet
1 min read
Description
This knowledge base explains the way to hide and show the “File” menu in ribbon of the Spreadsheet.
Solution
It can be achieved by using “hideMenu()” and “showMenu()” methods.
HTML
<div id="Spreadsheet"></div> <input type="button" onclick="hideMenu()" value="Hide Menu" /> <input type="button" onclick="showMenu()" value="Show Menu" />
JS
$(function () { $("#Spreadsheet").ejSpreadsheet({ sheets: [{ // window.defaultData from http://js.syncfusion.com/demos/web/scripts/xljsondata.min.js file dataSource: window.defaultData }], scrollSettings: { height: "100%", width: "100%" } }); });
RAZOR
@(Html.EJ().Spreadsheet<object>("Spreadsheet") .ScrollSettings(scroll => { scroll.Height("100%"); scroll.Width("100%"); }) .Sheets(sheet => { sheet.RangeSettings(range => { range.Datasource((IEnumerable<object>)ViewBag.Datasource).Add(); }).Add(); }) )
ASPX
<ej:Spreadsheet ID="Spreadsheet" runat='server'> <ScrollSettings Width="100%" Height="100%" /> <Sheets> <ej:Sheet> <RangeSettings> <ej:RangeSetting StartCell="A1" ShowHeader="true" /> </RangeSettings> </ej:Sheet> </Sheets> </ej:Spreadsheet>
function hideMenu() { $("#Spreadsheet").ejSpreadsheet("instance").XLRibbon.hideMenu(); } function showMenu() { $("#Spreadsheet").ejSpreadsheet("instance").XLRibbon.showMenu(); }
The following screenshot displays the Spreadsheet without the file menu.
You can refer the below UG Documentation,
https://help.syncfusion.com/api/js/ejspreadsheet#methods:xlribbon-hidemenu
https://help.syncfusion.com/api/js/ejspreadsheet#methods:xlribbon-showmenu