How to disable a particular sheet while importing excel in React Spreadsheet?
This knowledge base article explains you how to disable a particular sheet in React Spreadsheet. On the created event , fetched the file being imported and loaded into the spreadsheet component using open method. The imported file’s sheets were retrieved on the openComplete event, and the setProperties method was used to add the Hidden state to the sheet that needs to be disabled.
[App.tsx]
import * as React from 'react';
import './App.css';
import { SheetModel, SpreadsheetComponent } from '@syncfusion/ej2-react-spreadsheet';
function App() {
const spreadsheetRef = React.useRef<SpreadsheetComponent>(null);
const openCompleteHandler = (): void => {
// You can set the active sheet index of your imported file.
spreadsheetRef.current!.activeSheetIndex = 2;
const sheets: SheetModel[] = spreadsheetRef.current!.sheets;
// Set the first sheet in hidden state.
sheets[0].state = 'Hidden';
spreadsheetRef.current!.setProperties({ sheets: sheets }, true);
spreadsheetRef.current!.dataBind();
}
const createdhandler = (): void => {
// Import the sample excel that contains 5 sheets. Files available on the locally hosted service here.
fetch("http://localhost:3000/" + "sampleFile.xlsx")
.then((response) => {
response.blob().then((fileBlob) => {
let file: File = new File([fileBlob], "Sample.xlsx");
spreadsheetRef.current!.open({ file: file });
})
})
}
return (
<SpreadsheetComponent
openUrl='https://services.syncfusion.com/react/production/api/spreadsheet/open'
saveUrl='https://services.syncfusion.com/react/production/api/spreadsheet/save'
ref={spreadsheetRef}
openComplete={openCompleteHandler}
created={createdhandler}
>
</SpreadsheetComponent>
);
}
export default App;
Sample Link:
https://www.syncfusion.com/downloads/support/directtrac/general/ze/Hide_Sheet-1281592105
Output:
For further information about this, see the documentation that follows.
https://ej2.syncfusion.com/react/documentation/spreadsheet/worksheet#sheet-visibility
Conclusion
I hope you enjoyed learning about how to disable a particular sheet while importing excel in React Spreadsheet.
You can refer to our React Spreadsheet’s feature tour page to know about its other groundbreaking feature representations and documentations. You can also explore our React Spreadsheet example to understand how to present and manipulate data.
For current customers, you can check out our components from the License and Downloads page. If you are new to Syncfusion, you can try our 30-day free trial to check out our React Spreadsheet and other components.
If you have any queries or require clarifications, please let us know in comments below. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!