Nester Headers Goes Missing, Dataset do not update with programmatic dataset refresh

Tags: #<Tag:0x00007f8b1dca0b70>
#1

Hello,

I am facing an issue with rendering the handsontable-pro (licensed version).
I have created angular material tabs in HTML and have defined handsontables with nested headers for some of the tabs.

Please advice how to refresh handsontable correctly from a different tab where handsontable is not visible.

Steps taken:

  • On first tab, when I click on a button to refresh data in handsontable, which is on a different tab, then sometimes rendering does not happen correctly.
    Column headers does show at times and it also does not resize the columns dynamically.

When I manually resize the column then it is getting rendered correctly (with column headers and latest dataset).

  • If I am on same tab where the handsontable is and if I load the data , then I see no issue.

I am defining the handsontable for each tab like below-

tableSettings: any = {
//rowHeaders: true,
renderAllRows: true,
colHeaders: true,
allowColumnResize : true,
viewportColumnRenderingOffset: 27,viewportRowRenderingOffset: “auto”,
colWidths: 50,
height: 450,
allowInsertColumn: false,allowInsertRow: true,allowRemoveColumn: false,allowRemoveRow: true,
autoWrapRow: false,autoWrapCol: false,
stretchH: “all”,
minSpareRows:true,
//maxRows: 5,
manualRowResize: true,manualColumnResize: true,
columns: […],
nestedHeaders:[…],
contextMenu: [‘copy’,‘row_above’,‘row_below’,‘undo’,‘remove_row’],
};

detectChanges = (hotInstance, changes, source) => {
hotInstance.render();
}

versions -
handsontable-pro - 6.2.3,
handsontable-pro/angular - 3.0.1,

tabl_after_dataset_refresh_without_headers
tabl_after_dataset_refresh_without_headers.png1890×684 88.7 KB
correct_with_headers
correct_with_headers.png1889×681 136 KB
nested_heades_not_spread_out
nested_heades_not_spread_out.png1882×690 98.2 KB

#2

PS: Hi Aleksandra - Request you to please close ticket Nester Headers Goes Missing, Dataset does not update with programmatic dataset refresh as that is created with incorrect account. We will continue here please.

jsfiddle provided by you: https://jsfiddle.net/handsoncode/2a5dfum8/

#3

Done.

Hi @neeraj.kanchan

What are the exact steps on replicating the issue using your latest demo? That demo does not have tabs.

#4

I will try and create example with tabs but we have screens where at times headers goes missing.
Not sure if the way we do load data is the issue or something else.

One pattern I have seen is that if we have headers missing then if we resize browser size, headers comes back. This makes me feel that there is some issue in rendering the data.

Is there a way to force render the table after data is updated (other than detectChange function)

Thanks

image
image.png1026×427 19.5 KB
image
image.png1617×612 69.1 KB

#5

Can you send me a message on my email (support@handsontable.com), @neeraj.kanchan?

Maybe we could schedule a short call to test it out.

#6

That will be great. I have sent you a note.

#7

Thank you. I got the message. We can close this topic.

#8