Primeng: TurboTable keyboard navigation (up/down arrows)

[juststarted]

Hi!

Is there a plan to allow for keyboard navigation with TurboTable, particularly the up and down arrows? Upon clicking inside the grid, I would like to be able to use the up and down arrow keys to move about at the row level, not cell. The data is display only.

Thank you!
Michelle

[rodolfojnn]

As a temporary fix, I created a simple directive that intercepts the keys:

import { Directive, ElementRef, OnInit, HostListener } from '@angular/core';
import { Table } from 'primeng/table';

@Directive({
  selector: '[appTurboTableKeysDirective]'
})
export class TurboTableKeysDirective implements OnInit {

  constructor(private table: Table, private el: ElementRef<HTMLElement>) {}

  ngOnInit() {
    this.el.nativeElement.tabIndex = 1;
  }

  @HostListener('keydown.ArrowUp', ['$event']) ArrowUp($event: KeyboardEvent) {
    this.table.selection = this.navigateItem(-1);
    this.table.onRowSelect.emit({originalEvent: $event, data: this.table.selection, type: 'row'});
    event.preventDefault();
  }

  @HostListener('keydown.ArrowDown', ['$event']) ArrowDown($event: KeyboardEvent) {
    this.table.selection = this.navigateItem(1);
    this.table.onRowSelect.emit({originalEvent: $event, data: this.table.selection, type: 'row'});
    event.preventDefault();
  }

  navigateItem(num) {
    if (!this.table.selection) { return; }
    const i = this.table.value.indexOf(this.table.selection);
    const len = this.table.value.length;
    if (num > 0) {
      return this.table.value[(i + num) % len];
    }
    return this.table.value[(i + len + num) % len];
  }

}

[cagataycivici]

Planned for 6.2.0.

[andreeapNRO]

@cagataycivici : was this feature removed from 6.2.0 milestone?