HandsonTable AfterUpdate (OpenSource Version) - handsontable

Question

There seem to be two versions of the "Handsontable is a simple jQuery plugin for editable tables with basic copy-paste compatibility with Excel and Google Docs" So this question is about the open source (MIT) version, Handsontable 0.11.4. I am using selenium, I was able to add IDs to the cells using the code below. And I can add data to the table using selenium by.id. But then the afterChange is not called. Any tips on how to automatically trigger the afterChange event to get the ajax call to run in my code below?
function myRenderer(instance, td, row, col, prop, value, cellProperties) {
Handsontable.renderers.TextRenderer.apply(this, arguments);
td.setAttribute("id", "db<c:out value="${loopStatus.index}" />-row-"+row+"-"+"col"+col);
}
var $console<c:out value="${loopStatus.index}" /> = $("#colors_status<c:out value="${loopStatus.index}" />");
var autosave_notification<c:out value="${loopStatus.index}" />;
var data<c:out value="${loopStatus.index}" /> = ${oi.decorationBlock.colorSequenceDO.colors}
$("#colors<c:out value="${loopStatus.index}" />").handsontable({
data: data<c:out value="${loopStatus.index}" />,
minRows: ${oi.decorationBlock.colorSequenceDO.hotStartRows},
minCols: ${oi.decorationBlock.colorSequenceDO.hotStartCols},
colHeaders: ${oi.decorationBlock.colorSequenceDO.columnHeaders},
colWidths: [180,180,180,180,180,180,180,180,180,180,180,180,180,180,180,180,180,180,180,180,180,180,180,180,180,180,180,180,180,180],
manualColumnResize: true,
rowHeaders: true,
fixedColumnsLeft: 0,
minSpareRows: 1,
columns: [
${refData.autocomplete_colors}
],
afterChange: function (change, source) {
if (source === 'loadData') {
return; //don't save this change
}
clearTimeout(autosave_notification<c:out value="${loopStatus.index}" />);
$.ajax({
url: "save_colors.html?orderid=${command.order.id}&DBID=<c:out value="${oi.decorationBlock.id}" />",
dataType: "json",
contentType: "application/json",
type: "POST",
processData: false,
data: JSON.stringify({ColorAction: change}), //contains changed cells' data
complete: function (data) {
$console<c:out value="${loopStatus.index}" />.text('saving...');
autosave_notification<c:out value="${loopStatus.index}" /> = setTimeout(function () {
$console<c:out value="${loopStatus.index}" />.text('saved');
}, 1000);
}
});
}
});
var hotInstance = $("#colors<c:out value="${loopStatus.index}" />").handsontable('getInstance');
hotInstance.updateSettings({
cells: function(row, col, prop) {
var cellProperties = {};
cellProperties.renderer = myRenderer;
return cellProperties;
}
});