Forums Home / Spread / SpreadJS
Posted by: pooja.bansal on 22 October 2023, 9:52 pm EST
pooja.bansal
Posted 22 October 2023, 9:52 pm EST
We are using Spread js 16 in our web application.
When we delete any cell value using delete key on keyboard and then try to restore it using CTRL+Z is it not working. However, when we delete any cell value using mouse event - “Clear Contents” options and then try to restore it using CTRL+Z it works fine.
Please reply asap.
Regards
Pooja Bansal
ankit.kumar
Posted 23 October 2023, 12:03 am EST - Updated 23 October 2023, 12:08 am EST
Hi Pooja,
I tested with the latest version of SpreadJS and the undo functionality seems to be working fine at my end. Kindly refer to the following sample and the gif that I have tested with.
Could you share us a minimal working sample replicating the issue? You may also modify the above sample and share it with us replicating the issue.
Please also refer to the gif and let me know if I am missing any step.
Regards,
Ankit
pooja.bansal
Posted 25 October 2023, 8:13 pm EST
Hello,
We have explicitly registered del key command to delete the single/multiple values from Spread JS. Below is the code -
private registerDeleteButton(spread: GC.Spread.Sheets.Workbook) {
spread.commandManager().register('myCmdDel', { canUndo: false, execute: (context, options) => { const activeSheetIndex = spread.getActiveSheetIndex(); const activeSheet = spread.getActiveSheet(); let selectionObj = this.spreadService.setSelectionsParameters(spread); let isDefinitionColumn :boolean = false; let isLockedCell : boolean = false; let isDeleted : boolean = false; if(selectionObj && selectionObj?.selections.length > 0) { for(let i = selectionObj.beginRow; i < selectionObj.endRow; i++) { for(let j = selectionObj.beginCol; j < selectionObj.endCol; j++) { isDefinitionColumn = false; isLockedCell = false; // prevent deleting value from definition column let areaName : string = this.spreadService.getAreaName(activeSheetIndex, i); if (this.spreadService.isDefinitionColumn(activeSheetIndex, areaName, j)) isDefinitionColumn = true; if(activeSheet.getCell(i, j).locked()) isLockedCell = true; if(!isDefinitionColumn && !isLockedCell) { ** activeSheet.setValue(i, j, "");** isDeleted= true; } } } return isDeleted; } } }, KeyCodes.Delete, false, false, false, false);
}
The line - activeSheet.setValue(i, j, “”); is the reason of not working undo functionality.
If we comment this line undo is working fine but delete functionality stops working.
Kindly guide on this asap.
Regards
Pooja Bansal
ankit.kumar
Posted 26 October 2023, 5:41 pm EST - Updated 26 October 2023, 5:46 pm EST
Hi Pooja,
Thanks for sharing the code snippet with us. As per my understanding, you don’t want to delete the values for some cells when the delete key is pressed based on some condition. To achieve this functionality, you need to make the following changes in the code:
// Disable the default key command
spread
.commandManager()
.setShortcutKey(
undefined,
GC.Spread.Commands.Key.del,
false,
false,
false,
false
);Also, kindly set the “canUndo” option of the command to true. Kindly refer to the following code snippet:
// Define the Custom Command
var command = {
canUndo: true,
execute: function (context, options, isUndo) {
var Commands = GC.Spread.Sheets.Commands;
options.cmd = "customDeleteCommand";
if (isUndo) {
Commands.undoTransaction(context, options);
return true;
} else {
Commands.startTransaction(context, options);
// Get the SheetName From options
let sheet = context.getSheetFromName(options.sheetName);
// Get the Selection from Options
let selection = options.selection;
for (let i = selection.row; i < selection.row + selection.rowCount; i++) {
for (let j = selection.col; j < selection.col + selection.colCount; j++) {
// Check for Custom Condition
if (j !== 6) {
sheet.setValue(i, j, null);
}
}
}
Commands.endTransaction(context, options);
return true;
}
}
};
// Get the Command Manager's instance
var commandManager = spread.commandManager();
// Register the Custom Delete Command
commandManager.register("customDeleteCommand", command);
spread.commandManager().register('myCmdDel',
{
canUndo: false,
execute: (context, options) => {
let activeSheet = context.getActiveSheet();
let selection = activeSheet.getSelections()[0];
// Pass the sheetName and Selection as command options
spread.commandManager().execute({
cmd: "customDeleteCommand", sheetName: activeSheet.name()
, selection: selection
});
}
}, GC.Spread.Commands.Key.del, false, false, false, false);
In the above sample, you cannot delete the contents of the column “G” using the delete key. Further, if you delete any other cell contents, you will be able to undo/redo the action.
If the issue still persists for you, kindly share us a minimal working sample along with your exact use case. This will help us in understanding your issue and to resolve it quickly.
You could also refer to the following demo that shows how you could achieve the undo/redo functionality for a custom command: https://www.grapecity.com/spreadjs/demos/features/worksheet/actions/custom-action/purejs
References:
register method: https://www.grapecity.com/spreadjs/api/v15/classes/GC.Spread.Commands.CommandManager#register
setShortcutKey method: https://www.grapecity.com/spreadjs/api/v15/classes/GC.Spread.Commands.CommandManager#setshortcutkey
Regards,
Ankit
