Skip to content

form outouched status and checkboxes #14980

Closed
@jscti

Description

@jscti

Form with a mat-checkbox and a submit button (disabled when form untouched).
Form button don't get enable shen clicking on checkbox.

What is the expected behavior?

After clicking (only) the checkbox, the submit button (disabled when form untouched) should be enabled. But it stays disabled, even when clicking outside..

What is the current behavior?

Submit button stay disabled, even if user click outside.

What are the steps to reproduce?

See this repro stackblitz : https://stackblitz.com/edit/angumar-material-checkbox-yriwet?file=app/checkbox-overview-example.html

User lands on a form where he can update its address.
Form submit button is flaged as disabled has long as the user doesn't interact with the form.
User want to modify only the checkbox without touching the "name" field, but the "submit" button will never get enabled because the checkbox seems not to have lose focus.
Even if clicking outside the checkbox, the focus isn't losen.. only option to be able to submit this form : click 3 times the checkbox ... or click in the text field before submiting..

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

(version on stackblitz may not be up to date but on my project, it is) :
angular / angular-material : 7.2.1
mac OS 10.14.2 / Chrome 71.0.3578.98

Is there anything else we should know?

I understand the rule "touched" is applied only on blur(); but in this case it looks more like a bug.

Metadata

Metadata

Assignees

Labels

P3An issue that is relevant to core functions, but does not impede progress. Important, but not urgent

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions