p-table virtualScroll is scrolling a table when spacebar is pressed

Question

I did my best to find a solution but I had no luck this time. I am using PrimeNG p-table component (that has editable fields) and I have a virtualScroll active if there are more than 100 elements.

When there are less than 100 elements, everything works as a charm but when there is 100 and more (when virtualScroll is enabled), on every spacebar press, a table is a bit scrolled down and I am not able to enter empty characted in my input field.

I tried to do a preventDefault and that will prevent scroll, but still - I am not able to add empty char on spacebar click.

Do you have some nice idea how to solve this? I really appriciate it.

Answer 1

May be a quick workaround is to prevent the default behavior ONLY when the event is related to your specific input field (event key is ' ' or event code is 32 in this case). Something like that:

tableInputField.addEventListener('keydown', (event) => {
  if (event.key === ' ' || event.keyCode === 32) {
    event.preventDefault();
  }
});

I can't give more details without checking samples from your actual code. Hope it works!