wj-input-date's keyboard accessibility (opening dropdown calendar w/ keyboard)

Posted by: eh1160 on 10 November 2021, 3:22 am EST

  • Posted 10 November 2021, 3:22 am EST

    How should a user open the wj-input-date's dropdown calendar using the keyboard? I noticed that once I click on the down arrow with the mouse, I can navigate the calendar with the keyboard's arrow keys. But how would a user open the calendar in the first place (without the mouse)?

    The wj-input-date's down arrow is an HTML button, but it isn't keyboard focusable because Wijmo's internal HTML sets the tab-index to -1. If I use Chrome Console to set the tab-index to 0, the down arrow button becomes focusable. But it still doesn't respond to space or enter keys.
  • Replied 10 November 2021, 10:00 pm EST

    Hello,

    By default InputDate provide ALT + UP/DOWN(arrow keys) to open/close the calendar dropDown(when control is in focus). If you wish to set the custom command to open/close the calendar dropDown then you may use the isDroppedDown property of the inputDate to toggle the dropdown.

    Also, If you wish to set the tabIndex of the wijmo controls dynamically you can use the tabOrder property of the control. NOTE: tabOrder property is introduced in the wijmo build 2021v3.

    Regards
    Sonu Kumar Pandey
Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels