Custom objects as values of cells

[rob.cecil]

Does Handsontable yet support custom objects as values of cells?

Referring to this (Dec 2018):

Complex object from custom cell editor

I need to be able to store complex data (custom object) in a cell. I already have a cell editor and a cell renderer and I also have created a custom type for it. However It still doesn’t work. When my editor returns a complex object and that the orgValue was null, it doesn’t take the new value. Debugging through the code, I can see: my cell can be null from start and will be an object after cell has changed (i used own custom cell editor) Also the comparison of schema is too strict. Your lo…

Thanks

[aleksandra_budnik]

Hey Rob,

support for objects as cell values did not change. A cell can hold a single primitive value. However, cell meta can hold complex values with custom keys. Here’s an example https://jsfiddle.net/handsoncode/tb7rw0xk/

[rob.cecil]

That’s not what I mean. I’m following up with the forum post which I linked here.

“Complex object” != cell meta data.

[rob.cecil]

What I mean is this:

Handsontable expects the data property in settings to be assigned to an object which is:

• An array of arrays of strings, number, etc.
• An array of objects whose properties are interpreted as columns, etc.

But NOT

• An array of array of custom objects, each representing a single row & col

?

[aleksandra_budnik]

In the following topic the question was
is it possible to pass objects to a cell editor and the answer is NOT by default. That is why I proposed cell meta as an alternative.

I can share some more details after I get some

Input > exptected action

scheme.

[rob.cecil]

I already provided this scheme a week ago to Piotr. After a few iterations, we hit a wall.

I provided an example of what I am trying to do.

[rob.cecil]

Here’s the Sandbox. It demonstrates what I mean by “complex object”

Custom Renderer and Editor - CodeSandbox

It’s a 2x2 grid of data, each cell backed by a custom object (check out Cell.ts).

In essence this is how my app has been structured for months. I only ran into issues when I needed to edit cells. I use custom renderers to get HT to display the correct value, instead of a stringified version of my object (usually, “[object Object]”).

[rob.cecil]

I just wish this was more explicitly made clear in the documentation. Even though I was able to get a set of renderers to make it each cell display correctly, there is an implicit assumption somewhere in the HT code that makes constructing a custom editor impossible.

[rob.cecil]

There seems to be one good solution, fortunately.

That is to maintain a parallel structure used for HT specifically, and to refer back to the source object structure when I need to make changes (afterChanges handler) or retrieve metadata.

Example:

rangeData: api.Cell[][] = [];
displayData: string[][] = [];

settings.data is assigned to “displayData”. When handling the webservice call to retrieves these custom Cell objects (they are rehydrated via gRPC into generated JS code), I build the parallel structure. The renderer method signatures provides row & col, so a lookup into my “rangeData” structure is possible.

[aleksandra_budnik]

Thank you for sharing the updates.

To be honest Support Managers are not developers. We have some basic knowledge of JS but everything that is custom usually exceeds that package. To develop a custom editor, validator or a renderer that follows good practices and is compatible with all cell types and feature surely requires a lot od digging in the source code. I guess that at this point you are more aware that I am.

Currently we are all on into the development of the stable 8.0.0 version. Still, I can ask our Technical Writer to prepare a blogpost describing this topic in detail once we release. You’re right there aren’t many examples on how to construct custom editors so a quick tutorial about abilities and limitation sounds like a reasonable idea.

[rob.cecil]

You’re doing great!

I am totally willing to talk to anyone in your team about this architecture.

[aleksandra_budnik]

Thank you
I’ve sent a request to our technical writer on her private repo. I will update you once we set up a plan for the blog post.