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

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

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

• 

  eh1160

  • Post Options:
  • Link
    Copy

  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.

• 

  sonu.pandey

  

  • Post Options:
  • Link
    Copy

  Posted 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