Skip to content
This repository was archived by the owner on Sep 5, 2024. It is now read-only.

select(header): closes when filter input is focused #11969

Closed
Axeldorf opened this issue Jul 21, 2020 · 1 comment · Fixed by #11970
Closed

select(header): closes when filter input is focused #11969

Axeldorf opened this issue Jul 21, 2020 · 1 comment · Fixed by #11970
Assignees
@Splaktar
Labels
has: Pull Request A PR has been created to address this issue P1: urgent Urgent issues that should be addressed in the next minor or patch release. severity: regression This issue is related to a regression type: bug
Milestone
1.2.0

Comments

@Axeldorf
Copy link

Bug

Demo and steps to reproduce the issue

Demo URL (required)*:
With AngularJS Material Design v1.1.21: https://codepen.io/Axeldorf/pen/ExPGOpM
With AngularJS Material Design v1.1.24: https://codepen.io/Axeldorf/pen/yLeGQez

Detailed Reproduction Steps

  1. Open selector.
  2. Click on filter input

Explain the expected behavior

On focusing filter input, select element is not closed and user can write any filter.

Explain the current behavior

On focusing filter input, select element is closed and user can't write any filter.

Discuss the use-case or motivation for changing the existing behavior

User wants to filter options in select, so when user clicks on input to write select must be opened.

List the affected versions of AngularJS, Material, OS, and browsers

  • AngularJS: 1.7.8
  • AngularJS Material: 1.1.21 (works), 1.1.22+ (doesn't work)
  • OS: Ubuntu 18.04
  • Browsers: Chrome.
@Splaktar Splaktar changed the title Select closes when filter input is focused select: closes when filter input is focused Jul 21, 2020
@Splaktar Splaktar changed the title select: closes when filter input is focused select(header): closes when filter input is focused Jul 21, 2020
@Splaktar Splaktar self-assigned this Jul 21, 2020
@Splaktar Splaktar added P1: urgent Urgent issues that should be addressed in the next minor or patch release. severity: regression This issue is related to a regression type: bug labels Jul 21, 2020
@Splaktar Splaktar added this to the 1.2.0 milestone Jul 21, 2020
@Splaktar
Copy link
Member

Thank you for this report.

This doesn't happen in the select header demo because it uses multiple.

I've identified the issue and will open a PR soon.

@Splaktar Splaktar added the has: Pull Request A PR has been created to address this issue label Jul 21, 2020
Splaktar added a commit that referenced this issue Jul 21, 2020
@Splaktar
fix(select): md-select-header closes on mouse click when not using mu…
8ce54a9 
…ltiple

- if the click event came from within a `md-select-header`, `stopImmediatePropagation()`
  to keep the menu from closing
- fix demo's input being too short to display label when 'Kale' is selected
- rename some events and add types
- update select header input's placeholder and add an aria-label

Fixes #11969
@Splaktar Splaktar mentioned this issue Jul 21, 2020
Merged
3 tasks
Splaktar added a commit that referenced this issue Jul 22, 2020
@Splaktar
fix(select): md-select-header closes on mouse click when not using mu…
f2fca2e 
…ltiple

- if the click event came from within a `md-select-header`, `stopImmediatePropagation()`
  to keep the menu from closing
- fix demo's input being too short to display label when 'Kale' is selected
- rename some events and add types
- update select header input's placeholder and add an aria-label

Fixes #11969
Splaktar added a commit that referenced this issue Jul 22, 2020
@Splaktar
fix(select): md-select-header closes on mouse click when not using mu…
b32b473 
…ltiple

- if the click event came from within a `md-select-header`, `stopImmediatePropagation()`
  to keep the menu from closing
- fix demo's input being too short to display label when 'Kale' is selected
- rename some events and add types
- update select header input's placeholder and add an aria-label

Fixes #11969

(cherry picked from commit f2fca2e)
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees

@Splaktar Splaktar

Labels
has: Pull Request A PR has been created to address this issue P1: urgent Urgent issues that should be addressed in the next minor or patch release. severity: regression This issue is related to a regression type: bug
Projects
None yet
Milestone
1.2.0
Development

Successfully merging a pull request may close this issue.

fix(select): md-select-header closes on mouse click when not using multiple angular/material
2 participants
@Splaktar @Axeldorf