UpdateSettings doesn't update headers after Custom Insert Column

Tags: #<Tag:0x00007f1360444588> #<Tag:0x00007f1360444420>

I have a custom item to insert a column in my dropDownMenu. I have to use columns due to specific formatting. It opens a form openForm() and asks for the column name and data type. On submit it calls closeForm() which attempts to update data, columns, and headers. updateSettings loses the new column name and only appends to the end.
The data columns do not line up properly with the data. I tried hot.render() but it changes nothing.

https://jsfiddle.net/v3qw0tek/

Hi @bg.newland

Thank you for contacting us. I tested your example, and I’m not sure if I can see any issues with the newly added column besides not updating the column name. Can you please share a screenshot of your output?

That is the problem. The logic to update the column name is in closeForm(). I splice headers with the current index and call updateSettings, but the headers don’t update. Instead a new column with the next letter is created at the end.

hdrs.splice(insertCurCol, 0, key);

@bg.newland

Thank for clarifying this. I noticed that you use option, that is non existent in Handsontable config - headers. It should be done in colHeaders instead. I modified your example, and now I can see the new column header when adding a new column: https://jsfiddle.net/handsoncode/xqtom23a/

Is that your expected behavior?

I don’t know why or how, but at one time I had colHeaders and changed it to headers. Thank you for finding my error.

@bg.newland

No problem, I’m glad I could help.