Handsontable is an open source JavaScript/HTML5 UI Spreadsheet component for web apps.
Handsontable javascript library as a ‘real time’ CRUD interface to SQL server. I have created a basic script to load up an instance of Handsontable in a browser and display some test data. See below.
The key handsontable functions which allow you to load and save your data present in your table are :
hot.loadData(data) // To put data into your table
hot.getData() // To extract the current data present in your table
If you use jQuery (and I do have a personal preference to Post and Get with it), the equivalent of the ajax function would be :
// For Saving
jQuery.ajax({
type: "POST",
'url':'yourJsonPath/save.json',
data: JSON.stringify(hot.getDate()),
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json'
},
'success': function () {
console.log("Data Saved");
},
'error': function () {
console.log("Saving error");
}
});
// For Loading
jQuery.ajax({
type: "GET",
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json'
},
'url':'yourJsonPath/load.json',
'success': function (res) {
hot.loadData(res.data);
},
'error': function () {
console.log("Loading error");
}
});