Hi,
Please refer to the below answers to your questions.
- As I can understand, you want to set some value in the added column/row headers when the custom item in the context menu is clicked.
For this, you can add a custom option in the context menu by adding the custom option in the config of the designer(config.contextMenu property) and the corresponding command in the command map of the config. The execute() method of the command would be executed when the custom option in the context menu is clicked. You can set the value to headers with sheet.setValue() or cellRange.value() methods inside the execute() method.
let customCommand = {
commandName: 'customCommand',
text: 'Custom Command',
visibleContext: 'ClickViewport || ClickRowHeader || ClickColHeader',
execute: function (context, args, info) {
let sheet = context.getWorkbook().getSheetFromName(info.sheetName);
let activeCol = sheet.getActiveColumnIndex();
}
}
- You can use spread.import() method to load an xlsx file in SpreadJS. You can bind an event handler to the “click” event of the button and when the button is clicked, the handler will execute to load the file in SpreadJS.
You may refer to https://www.grapecity.com/spreadjs/demos/features/spreadjs-file-format/overview/react to learn about loading different types of files into SpreadJS.
- You can use spread.refresh() and designer.refresh() methods to refresh the spread and designer respectively. The spread.refresh() method refreshes the appearance and size(if the host element size of the spread is changed)of the spread which can be changed due to modification in the CSS. It does not refresh the content inside the sheets.
The spread.repaint() method can be used to repaint the content of the sheet on the canvas.
The designer.refresh() method refreshes the designer to reflect style changes, changes in the size of the host element, and modified config of the designer.
Alternatively, if you want to remove the the Designer or Workbook instance, you could use the designer.destroy() or spread.destroy() method respectively.
Please refer to the attached sample for more understanding.
sample: https://jscodemine.grapecity.com/share/adOw0XG74kCwSkinDg6WSQ/?IsEmbed=false&Theme=Unset&PreviewDirection=0&IsEditorShow=true&IsExplorerShow=true&IsPreviewShow=true&IsConsoleShow=true&IsRunBTNShow=false&IsResetBTNShow=false&IsOpenInCodemineBTNShow=false&PanelWidth=20&PanelWidth=50&PanelWidth=30&defaultOpen={"OpenedFileName"%3A["%2Findex.html"%2C"%2Fsrc%2Fapp.jsx"]%2C"ActiveFile"%3A"%2Fsrc%2Fapp.jsx"}
As I can see that you have also asked the same questions/queries on the ticket CAS-44656-Z7L8K2. Our team has also replied to the mentioned ticket. Please note that it is always recommended not to post duplicate queries on the forum and customer portal. It will help us to better track the queries and provide solutions efficiently.
References:
sheet.setValue(): https://www.grapecity.com/spreadjs/api/v16/classes/GC.Spread.Sheets.Worksheet#setvalue
sheet.getRange(): https://www.grapecity.com/spreadjs/api/v16/classes/GC.Spread.Sheets.Worksheet#getrange
cellRange.value(): https://www.grapecity.com/spreadjs/api/v16/classes/GC.Spread.Sheets.CellRange#value
spread.refresh(): https://www.grapecity.com/spreadjs/api/v16/classes/GC.Spread.Sheets.Workbook#refresh
designer.refresh(): https://www.grapecity.com/spreadjs/api/v16/designer/classes/GC.Spread.Sheets.Designer.Designer#refresh
Regards
