Added required input in checkbox component #77
Conversation
Blackbaud-AlexKingman
requested a review
from Blackbaud-SteveBrush
as a code owner
Codecov Report
@@ Coverage Diff @@
## master #77 +/- ##
=====================================
Coverage 100% 100%
=====================================
Files 23 24 +1
Lines 877 895 +18
Branches 119 124 +5
=====================================
+ Hits 877 895 +18
Continue to review full report at Codecov.
|
|
|
||
| if (this.required && !control.value) { | ||
| return { | ||
| 'required': true |
There was a problem hiding this comment.
If I check the checkbox it becomes "valid", but if I uncheck it, it remains "valid". Shouldn't it be invalid?
There was a problem hiding this comment.
Yes, but I'm unable to replicate this. We also have two unit tests that check for this in both reactive and T-D. Are you doing this with the visual demo, or did you make your own component?
There was a problem hiding this comment.
I encountered this on the visual demo.
Blackbaud-AlexKingman
changed the title
src/app/public/modules/checkbox/checkbox-required-validator.directive.ts
Show resolved
Hide resolved
There was a problem hiding this comment.
<form
[formGroup]="reactiveFormGroup"
novalidate
>
<sky-checkbox
formControlName="reactiveCheckbox"
>
<sky-checkbox-label>
Check me
</sky-checkbox-label>
</sky-checkbox>
</form>
this.reactiveFormGroup = this.formBuilder.group(
{
reactiveCheckbox: new FormControl(undefined, Validators.required)
}
);
When I use the above setup, a checkbox is still (incorrectly) considered valid when I check and uncheck it. This works fine when using the input, however. Disregard; this works with the Validators.requiredTrue!
New
@Input()property:required- Indicates if the checkbox must be checked to be valid. This property accepts a boolean values.Impact of setting
requiredtotrue:aria-requiredattribute added toinputelementrequiredattribute added toinputelementThis works with both template-driven & reactive forms.