Material: autofocus on md-select search input field

Created on 22 Sep 2016  路  3Comments  路  Source: angular/material

Actual Behavior:

  • What is the issue? * Cannot autofocus the search input field in md-select-header. If navigating the page purely by keyboard, the search field can't be accessed without the click of the mouse.
  • What is the expected behavior? If md-select has md-select-header with search input field, the field should be auto-focused by default or optionally - similarly to Select2/ui-select

CodePen (or steps to reproduce the issue): *

  • No codepen, as it can be seen in the Angular-Material Demo page

Angular Versions: *

  • Angular Version: 1.5.6

- Angular Material Version: 1.1.1

Shortcut to create a new CodePen Demo.
Note: * indicates required information. Without this information, your issue may be auto-closed.

Do not modify the titles or questions. Simply add your responses to the ends of the questions.
Add more lines if needed.

duplicate

Most helpful comment

Possibly related or dupe of #9146. I did an ugly work around that forces focus on the input here: http://codepen.io/mckenzielong/pen/GqGkZJ

All 3 comments

Possibly related or dupe of #9146. I did an ugly work around that forces focus on the input here: http://codepen.io/mckenzielong/pen/GqGkZJ

This is a larger accessibility issue than just focus on opening the menu. I forked your workaround to make it accessible (and even uglier) https://codepen.io/npbenjohnson/pen/weWzPy?editors=1111

If the pop-open focus gets fixed, and instead of swallowing all input that navigates out of the option menu, there were optional expressions to handle it. It could handle everything the directive does way cleaner.

Was this page helpful?
0 / 5 - 0 ratings