Handsontable v14.0.0 setDataAtRowProp is throwing Error!

Tags: #<Tag:0x00007f1360568108> #<Tag:0x00007f1360743f68>

getDataAtRowProp is returning the value of the property in the mentioned index, but the set method throws an error.

Error Logged

hot.getDataAtRowProp(0, ‘Cohort’)
‘2’

hot.setDataAtRowProp(0, ‘Cohort’, ‘3’)
utils.mjs:101 Uncaught Error: Assertion failed: Expecting an unsigned number.
at assert (utils.mjs:101:11)
at LazyFactoryMap.obtain (lazyFactoryMap.mjs:173:11)
at CellMeta.getMeta (cellMeta.mjs:125:53)
at MetaManager.getCellMeta (index.mjs:146:36)
at Core.getCellMeta (core.mjs:3113:24)
at validateChanges (core.mjs:1188:39)
at Core.setDataAtRowProp (core.mjs:1498:5)
at data-explorer-grid.component.ts:680:21
at Array.forEach ()
at Core.afterChange (data-explorer-grid.component.ts:678:21)
assert @ utils.mjs:101
obtain @ lazyFactoryMap.mjs:173
getMeta @ cellMeta.mjs:125
getCellMeta @ index.mjs:146
Core.getCellMeta @ core.mjs:3113
validateChanges @ core.mjs:1188
Core.setDataAtRowProp @ core.mjs:1498
(anonymous) @ data-explorer-grid.component.ts:680
afterChange @ data-explorer-grid.component.ts:678
(anonymous) @ handsontable-angular.js:51
invoke @ zone.js:368
onInvoke @ core.mjs:14723
invoke @ zone.js:367
run @ zone.js:129
run @ core.mjs:14574
mergedSettings. @ handsontable-angular.js:51
fastCall @ function.mjs:293
run @ pluginHooks.mjs:2821
Core.runHooks @ core.mjs:4426
applyChanges @ core.mjs:1283
(anonymous) @ core.mjs:1499
waitingForValidator.onQueueEmpty @ core.mjs:1182
checkIfQueueIsEmpty @ core.mjs:1142
validateChanges @ core.mjs:1216
Core.setDataAtRowProp @ core.mjs:1498
eval @ VM2700:1
(anonymous) @ data-explorer-grid.component.ts:680
afterChange @ data-explorer-grid.component.ts:678
(anonymous) @ handsontable-angular.js:51
invoke @ zone.js:368
onInvoke @ core.mjs:14723
invoke @ zone.js:367
run @ zone.js:129
run @ core.mjs:14574
mergedSettings. @ handsontable-angular.js:51
fastCall @ function.mjs:293
run @ pluginHooks.mjs:2821
Core.runHooks @ core.mjs:4426
applyChanges @ core.mjs:1283
(anonymous) @ core.mjs:1468
waitingForValidator.onQueueEmpty @ core.mjs:1182
checkIfQueueIsEmpty @ core.mjs:1142
validateChanges @ core.mjs:1216
Core.setDataAtCell @ core.mjs:1467
populateFromArray @ core.mjs:1032
Core.populateFromArray @ core.mjs:1587
saveValue @ baseEditor.mjs:240
finishEditing @ baseEditor.mjs:322
closeEditor @ editorManager.mjs:241
closeEditorAndSaveChanges @ editorManager.mjs:253
callback @ closeAndSave.mjs:5
commands. @ index.mjs:28
callback @ editor.mjs:16
recorderCallback @ manager.mjs:133
onkeydown @ recorder.mjs:92
invokeTask @ zone.js:402
runTask @ zone.js:173
invokeTask @ zone.js:483
invokeTask @ zone.js:1631
globalCallback @ zone.js:1674
globalZoneAwareCallback @ zone.js:1695

Hi @arvind.thiruvalur

Thank you for contacting us. Can you please share the code demo where the issue is replicable?

afterChange: (changes, source) => {

      if (changes) {

        const hot = this.dataExplorerGrid.HandsonTableInstance;

        changes.forEach(element => {

          hot.setDataAtRowProp(element[0], 'Cohort', 2);

        });

      }

    }

Hi @arvind.thiruvalur

Thank you for the code. I can see that you are assigning a number as a value, which isn’t correct, it should be a string. Also, I can’t properly check it because I don’t know what the Cohort prop is in your table. You can modify this example to show the issue more clearly, but at first please change the numeric value to a string.

https://jsfiddle.net/handsoncode/b3oj4tx5/

Hi @adrian.szymanski
Thanks for the suggestion.
Yeah, I tried setting string as value but was getting the same error as attached in screenshot. Initially I tried with string value only (As in the screenshot) and got the error.

But the same code works without any issues with the older Handsontable Version.

Code demo:
https://jsfiddle.net/xow1p9f7/

The older version where the same code worked fine is 7.4.3.
With 14.0.0 we are getting this error.

Hi @arvind.thiruvalur

Thank you for the details. We didn’t have 7.4.3 version, we had 7.4.2 and then 8.0. As you can see here, with v. 7.4.2 it still doesn’t work properly: https://jsfiddle.net/handsoncode/ckmegzfx/

The thing is, that setDataAtRowProp() work only for objects, you would need to use setDataAtCell() if your data set is defined as array of arrays. Additionally, setting this inside afterChange hook creates infinite loop.

Here are examples:

Hi @adrian.szymanski

Many thanks for your analysis and result.

We actually do have the data as an Array of objects. But we are accessing it within afterChange() function, we actually need to handle some business logic in this event hook where it fails.

As an alternative we are able to directly access the object and update without using this library method.

Is this a known issue or any alternatives we can use.

Thanks

Hi @arvind.thiruvalur

I see, but can you please share how it used to work in your implementation? Those are the hooks that we didn’t touch for quite some time, so it seems that nothing should have changed with v. 14.0.

Hi @arvind.thiruvalur do we have any updates here?