Search code examples
angularjsscrollviewkeyboard-navigation

Table doesn't scroll when using keyboard navigation


I have create a scroll-able Angular table and have implemented the content navigation when pressing the up and down keys in order to let the users navigate easily through the results even though the rows get selected the inner content area with the results isn't scrolling.

How can I scroll the inner container as I go up or down, I have created sample plunker to demonstrate the error.

Sample plunker


Solution

  • If you want to stay with angular, I would suggest using anchors and scrolling them into the view. You can find a similar problem with a solution using anchors here.


    If you have the option to use jQuery, you can simply select the row you want to scroll to (for example by using its class name) and then call the scrollTop() function on your table to scroll it to the position of the row. Here is an example using jquery. For reference you could take a look at this or this stackoverflow question.