Need help with allowedKeys on action for special keys

1

Hi, Basically my issue is i don’t know how to put direction keys and the esc key in the list of allowed keys. I want to trigger an action when the uses presses the up arrow on the keyboard and another action for the down arrow.

I tried the following and it fires for the ‘d’ and the ‘f’ but not the up arrow. {{action ‘testing’ this on=“keyPress” allowedKeys=“d⇧f”}}

I am trying to build template that lists items from an array and allows you to select items using the up and down arrows of the keyboard. First item is automatically selected. Currently aiming to use another template to display the details of the selected item and highlighting to show the current item selected in the list.

2

Just discovered that allowedKeys is in fact not uses as i tried other alpha keys and they triggered the event but arrow keys still don’t trigger the even. This is a bigger issue as this means i can’t bind different keys to do different things as the key that triggered the action is not passed through.

3

keypress doesn’t trigger on arrow keys in webkit browsers, use keyup / keydown instead.

Basically, keypress was originally used in conjunction with event.charCode to give you the actual character which was pressed on the keyboard. Arrow keys aren’t characters, and so don’t fire on keypress.

keyup / keydown set event.keyCode and fire on all keys.

There’s some good info at MDN & PPK goes into more depth

Hope that helps.

4

I followed up to your other response with an example of what I think you’re trying to achieve. key up & key down list example

1 Like
5

@rlivsey thanks for the info

@jasonmit thanks for the example that is exactly what i am looking for.

6

This topic was automatically closed after 3 days. New replies are no longer allowed.