Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Recreating FormGroup with disabled attribute has different effect on matSelect vs matInput #17860

Closed
kyletanders opened this issue Dec 2, 2019 · 4 comments · Fixed by #17872
Closed

Recreating FormGroup with disabled attribute has different effect on matSelect vs matInput #17860

kyletanders opened this issue Dec 2, 2019 · 4 comments · Fixed by #17872
Assignees
@crisbeto
Labels
area: material/input area: material/select P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent

Comments

@kyletanders
Copy link

Reproduction

Use StackBlitz to reproduce your issue:
https://stackblitz.com/edit/components-issue-qr6rcq

Steps to reproduce:

  1. Click Recreate Form button
  2. Notice that the input is disabled but the mat-select is not

Also just for comparison see that calling formControl.disable() does work as expected:
3. Reload the page
4. Click 'Disable Function' button
5. Notice both input and select are disabled as expected

Expected Behavior

What behavior were you expecting to see?
Expected matSelect and matInput to both be disabled when creating a new FormGroup where the disabled value was set to true for both of them.

Actual Behavior

What behavior did you actually see?
Only the matInput was disabled

Environment

  • Angular: 8.0.0
  • CDK/Material: 8.0.0
  • Browser(s): Chrome
  • Operating System (e.g. Windows, macOS, Ubuntu): Windows
@crisbeto crisbeto self-assigned this Dec 4, 2019
@crisbeto crisbeto added has pr P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent labels Dec 4, 2019
crisbeto added a commit to crisbeto/material2 that referenced this issue Dec 4, 2019
@crisbeto
fix(select): disabled state out of sync when swapping form group with…
02e1c57 
… a disabled one

Fixes the disabled state of a `mat-select` falling out of sync with its form control if the control's group is swapped out with one that is disabled on init.

Fixes angular#17860.
@crisbeto crisbeto mentioned this issue Dec 4, 2019
Merged
@Skfsh
Copy link

Skfsh commented Dec 18, 2019

Actually this issue applies to other controls as well.

https://stackblitz.com/edit/angular-8-material-starter-template-szedxq?file=src%2Fapp%2Fapp.component.html

Only Input, datepicker and autocomplete work as expected.

@crisbeto
Copy link
Member

This came up in #17985.

@kyletanders
Copy link
Author

kyletanders commented Feb 26, 2020 •
edited
Loading

Quick note on this... it appears the datepicker has a similar issue. The input itself seems to be disabled, but the icon that triggers the datepicker is still enabled and allows you to select a date. See demo from Skfsh: https://stackblitz.com/edit/angular-8-material-starter-template-szedxq?file=src%2Fapp%2Fapp.component.html

crisbeto added a commit to crisbeto/material2 that referenced this issue Aug 21, 2020
@crisbeto
fix(select): disabled state out of sync when swapping form group with…
cf377fe 
… a disabled one

Fixes the disabled state of a `mat-select` falling out of sync with its form control if the control's group is swapped out with one that is disabled on init.

Fixes angular#17860.
crisbeto added a commit to crisbeto/material2 that referenced this issue Nov 26, 2020
@crisbeto
fix(material/select): disabled state out of sync when swapping form g…
a1fffb5 
…roup with a disabled one

Fixes the disabled state of a `mat-select` falling out of sync with its form control if the
control's group is swapped out with one that is disabled on init.

Fixes angular#17860.
crisbeto added a commit to crisbeto/material2 that referenced this issue Dec 6, 2020
@crisbeto
fix(material/select): disabled state out of sync when swapping form g…
46a247d 
…roup with a disabled one

Fixes the disabled state of a `mat-select` falling out of sync with its form control if the
control's group is swapped out with one that is disabled on init.

Fixes angular#17860.
crisbeto added a commit to crisbeto/material2 that referenced this issue Jan 7, 2021
@crisbeto
fix(material/select): disabled state out of sync when swapping form g…
ef20461 
…roup with a disabled one

Fixes the disabled state of a `mat-select` falling out of sync with its form control if the
control's group is swapped out with one that is disabled on init.

Fixes angular#17860.
crisbeto added a commit to crisbeto/material2 that referenced this issue Mar 3, 2022
@crisbeto
fix(material/select): disabled state out of sync when swapping form g…
7a9b1dc 
…roup with a disabled one

Fixes the disabled state of a `mat-select` falling out of sync with its form control if the
control's group is swapped out with one that is disabled on init.

Fixes angular#17860.
crisbeto added a commit to crisbeto/material2 that referenced this issue Mar 3, 2022
@crisbeto
fix(material/select): disabled state out of sync when swapping form g…
e921ebf 
…roup with a disabled one

Fixes the disabled state of a `mat-select` falling out of sync with its form control if the
control's group is swapped out with one that is disabled on init.

Fixes angular#17860.
crisbeto added a commit that referenced this issue Mar 3, 2022
@crisbeto
fix(material/select): disabled state out of sync when swapping form g…
723a821 
…roup with a disabled one (#17872)

Fixes the disabled state of a `mat-select` falling out of sync with its form control if the
control's group is swapped out with one that is disabled on init.

Fixes #17860.
crisbeto added a commit that referenced this issue Mar 3, 2022
@crisbeto
fix(material/select): disabled state out of sync when swapping form g…
d22d73a 
…roup with a disabled one (#17872)

Fixes the disabled state of a `mat-select` falling out of sync with its form control if the
control's group is swapped out with one that is disabled on init.

Fixes #17860.

(cherry picked from commit 723a821)
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Apr 3, 2022
forsti0506 pushed a commit to forsti0506/components that referenced this issue Apr 3, 2022
@crisbeto @forsti0506
fix(material/select): disabled state out of sync when swapping form g…
3dd076c 
…roup with a disabled one (angular#17872)

Fixes the disabled state of a `mat-select` falling out of sync with its form control if the
control's group is swapped out with one that is disabled on init.

Fixes angular#17860.
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees

@crisbeto crisbeto

Labels
area: material/input area: material/select P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent
Projects
None yet
Milestone
No milestone
4 participants
@crisbeto @andrewseguin @Skfsh @kyletanders