Spreadsheet Change History

All important changes in the spreadsheet are tracked under the History internal container. From version 8 on, the history is one array shared for all worksheets. In this section, we provide a few more details about the spreadsheet changes tracker.

Documentation

Methods

The undo and redo methods are normally invoked by the CTRL+Z, CTRL+Y keyboard shortcut. The following methods can be called programmatically, as follows:

Method	Description
undo()	Undo the last spreadsheet changes. `undo() : void`
redo()	Redo the most recent spreadsheet changes. `redo() : void`
setHistory(object)	Redo the most recent spreadsheet changes. `setHistory(history: Object) : void`
resetHistory()	Redo the most recent spreadsheet changes. `resetHistory() : void`

Events

Events related to the history changes tracker.

Event	Description
onredo	`onredo(worksheet: Object, info: Object) : null` The info array contains all necessary information about the history and depends on which change was performed.
onundo	`onundo(worksheet: Object, info: Object) : null` The info array contains all necessary information about the history and depends on which change was performed.

Example

As explained above, the history actions are available on the spreadsheet level.

<html>
<script src="https://jspreadsheet.com/v9/jspreadsheet.js"></script>
<script src="https://jsuites.net/v5/jsuites.js"></script>
<link rel="stylesheet" href="https://jspreadsheet.com/v9/jspreadsheet.css" type="text/css" />
<link rel="stylesheet" href="https://jsuites.net/v5/jsuites.css" type="text/css" />

<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Material+Icons" />

<div id='spreadsheet'></div>

<br/>
<input type="button" value="Undo" id="undobtn" />
<input type="button" value="Redo" id="redobtn" />
<input type="button" value="Reset" id="resetbtn" />

<script>
// Set your JSS license key (The following key only works for one day)
jspreadsheet.setLicense('YjY2OGU5OTJmNmVkMjcxZTYzYmU4ZWU2ZDEyMTVmZTdjOGRkMzE1ZWVmN2ZiYzZmNGVmODdmYzhhMjhmZDNmOWU0OTlhMTdkMWI0MTZiZDFjMjMwNzY5YmRmNDkyZDE3NGY2YmJkYmQ4YmEwNmQ5N2Y2MmZiNTE5MTE4MzA3OWMsZXlKamJHbGxiblJKWkNJNklpSXNJbTVoYldVaU9pSktjM0J5WldGa2MyaGxaWFFpTENKa1lYUmxJam94TnpNMU1USTRPVFkyTENKa2IyMWhhVzRpT2xzaWFuTndjbVZoWkhOb1pXVjBMbU52YlNJc0ltTnZaR1Z6WVc1a1ltOTRMbWx2SWl3aWFuTm9aV3hzTG01bGRDSXNJbU56WWk1aGNIQWlMQ0ozWldJaUxDSnNiMk5oYkdodmMzUWlYU3dpY0d4aGJpSTZJak0wSWl3aWMyTnZjR1VpT2xzaWRqY2lMQ0oyT0NJc0luWTVJaXdpZGpFd0lpd2lkakV4SWl3aVkyaGhjblJ6SWl3aVptOXliWE1pTENKbWIzSnRkV3hoSWl3aWNHRnljMlZ5SWl3aWNtVnVaR1Z5SWl3aVkyOXRiV1Z1ZEhNaUxDSnBiWEJ2Y25SbGNpSXNJbUpoY2lJc0luWmhiR2xrWVhScGIyNXpJaXdpYzJWaGNtTm9JaXdpY0hKcGJuUWlMQ0p6YUdWbGRITWlMQ0pqYkdsbGJuUWlMQ0p6WlhKMlpYSWlMQ0p6YUdGd1pYTWlYU3dpWkdWdGJ5STZkSEoxWlgwPQ==');

// Create the spreadsheet
let spreadsheet = jspreadsheet(document.getElementById('spreadsheet'), {
    worksheets: [{
        minDimensions: [8, 8],
    }],
});

document.getElementById("undobtn").onclick = () => spreadsheet[0].undo()
document.getElementById("redobtn").onclick = () => spreadsheet[0].redo()
document.getElementById("resetbtn").onclick = () => spreadsheet[0].parent.resetHistory()
</script>
</html>

Edit this page on GitHub