Header not scrollable

Tags: #<Tag:0x00007efc60b2a378>
#1

Hi,

I am using Angular Wrapper of Handsontable table, with Angular 8 and angular material.
When i am scrolling , header are not scrolling with the rows data.

Can u lease help to resolve this issue.

Regards,
Naveen

#2

Hey @nav2jaiswal

can you please load your code to the CodeSandbox or Stackblitz?

#3

Hi @aleksandra_budnik,

My Problem is same as the below.

Do you have any idea when this issue going to be fixed

Also, can u please let me know where in which hook i can update the this.updateSettings({}) as workaround

#4

Hey @nav2jaiswal

Unfortunately, we have not yet fixed this issue because we are working on the very important version of Handsontable (vanilla) that we are planning to release in parts.

this.updateSettings({}) as workaround you should attach to afterInit hook.
Here is an example demo - https://jsfiddle.net/7m1056ts/

#6

Hi @piotr.nowak,

Sorry I was not able to implement the workaround,
I have reproduce my same problem below StackBlitz.

Can you please help me with the workaround.

Thanks,
Naveen

#7

Hi @aleksandra_budnik,

Can you please provide example for the same, as it is bit urgent.

Thanks,
Naveen

#8

You have a data set with 3 columns and 8 rows, but in <hot-table> you defined too many columns

  1. <hot-column data="id" [readOnly]="true" title="ID"></hot-column>

  2. <hot-column data="name" title="Full name"></hot-column>

  3. <hot-column data="address" title="Street name"></hot-column>

  4. <hot-column data="id" [readOnly]="true" title="ID"></hot-column>

  5. <hot-column data="name" title="Full name"></hot-column>

  6. <hot-column data="address" title="Street name"></hot-column>

  7. <hot-column data="id" [readOnly]="true" title="ID"></hot-column>

  8. <hot-column data="name" title="Full name"></hot-column>

  9. <hot-column data="address" title="Street name"></hot-column>

  10. <hot-column data="id" [readOnly]="true" title="ID"></hot-column>

  11. <hot-column data="name" title="Full name"></hot-column>

  12. <hot-column data="address" title="Street name"></hot-column>

  13. <hot-column data="id" [readOnly]="true" title="ID"></hot-column>

  14. <hot-column data="name" title="Full name"></hot-column>

  15. <hot-column data="address" title="Street name"></hot-column>

Every <hot-column> have to correspond to data just like in this our basic demo - https://handsontable.com/docs/7.3.0/frameworks-wrapper-for-angular-simple-example.html

#10

Hi @piotr.nowak,

I have kept the columns repeated for demo purpose.
I have updated the data, but still horizonatal scrolling is not working,
On scroll table rows are scrolling but headers are sticky and not scrolling along with rows.

Regards,
Naveen

#11

Hi @nav2jaiswal

Sorry, but I spent on this task for about 2 hours.
We would be happy to help with this however, the support services are a part of our commercial offer. If you have an Extended or Premium support plan I can spend more time on a code review.

#12

Hi @piotr.nowak,

Can you please have a look on this on priority.
Please let me know if you need any more clarifications.

Regards,
Naveen

#13

Hi @power.sg.license.key

Could you send me your license key?
If you don’t want to share it on the forum, please send to support@handsontable.com.

#14

shared on the given email

#15

Thank you. I have already send a reply on email so I’m closing this topic.

#16