Skip to content

igx-date-picker and igx-time-picker doesn't handle required properly #6471

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
Closed
kdinev opened this issue Jan 15, 2020 · 1 comment · Fixed by #6722 or #6877
Closed

igx-date-picker and igx-time-picker doesn't handle required properly #6471

kdinev opened this issue Jan 15, 2020 · 1 comment · Fixed by #6722 or #6877
Assignees
@Lipata @damyanpetev @wnvko
Labels
💥 severity: critical 🐛 bug Any issue that describes a bug 🕐 time-picker 📅 date-picker version: 8.2.x version: 9.0.x version: 9.1.x ✅ status: resolved Applies to issues that have pending PRs resolving them, or PRs that have already merged.

Comments

@kdinev
Copy link
Member

kdinev commented Jan 15, 2020 •
edited
Loading

Description

The HTML validation doesn't pass through the igx-date and time pickers properly. Required doesn't put asterisk in the label, no red borders when touched and invalid, etc.

  • igniteui-angular version: 8.2.14
  • browser: all

Steps to reproduce

  1. Create a date picker and mark it required.
<igx-date-picker label="Start Date"
                 name="startDate"
                 required
                 [(ngModel)]="tournament.StartDate">
</igx-date-picker>

Result

No visual indication in the component that it's required in the form.

Expected result

To behave like other form components.
@Lipata
Copy link
Member

Lipata commented Jan 17, 2020 •
edited
Loading

Added to the igxDateTimeEditorDirective specification.

@wnvko wnvko self-assigned this Feb 5, 2020
@wnvko wnvko added 🛠️ status: in-development Issues and PRs with active development on them 💥 severity: critical and removed 🧨 severity: medium labels Feb 5, 2020
wnvko added a commit that referenced this issue Feb 13, 2020
@wnvko
test(date-picker): add test for reactive form, #6471
4027a4a
@wnvko wnvko mentioned this issue Feb 13, 2020
Merged
14 tasks
wnvko added a commit that referenced this issue Feb 13, 2020
@wnvko
fix(date-picker): fix validation of date picker, #6471
0ed5a2d
wnvko added a commit that referenced this issue Feb 17, 2020
@wnvko
test(date-picker): add test for control value accessor, #6471
9c5a58f
wnvko added a commit that referenced this issue Feb 17, 2020
@wnvko
fix(time-picker): implement control value accessor, #6471
3ca6cde
@wnvko wnvko added ✅ status: resolved Applies to issues that have pending PRs resolving them, or PRs that have already merged. and removed 🛠️ status: in-development Issues and PRs with active development on them labels Feb 17, 2020
wnvko added a commit that referenced this issue Feb 18, 2020
@wnvko
test(igx-calendar): fix failing test, #6471
051aefa
wnvko added a commit that referenced this issue Feb 19, 2020
@wnvko
fix(date-picker): updae ngModel on outside click, #6471
e21d466 
If we drop down the calendar when input has no value,
onBlur gets called but we do not call onTouchCallback
which is correct. However if after we click outside the
input the model is never validated. This is why we
should validate model, in this case, and in onClosing event.
wnvko added a commit that referenced this issue Feb 24, 2020
@wnvko
test(date-picker): update test to correctly click, #6471
ce1b293
wnvko added a commit that referenced this issue Feb 24, 2020
@wnvko
test(*): allow UIInteraction to click everywhere, #6471
d22c63f
wnvko added a commit that referenced this issue Feb 24, 2020
@wnvko
fix(date-picker): stop input self validation, #6471
0eb668e
wnvko added a commit that referenced this issue Feb 24, 2020
@wnvko
test(date-picker): fix failing test, #6471
c79f8cd
wnvko added a commit that referenced this issue Feb 24, 2020
@wnvko
test(time-picker): fix failing tests, #6471
21ccad2
wnvko added a commit that referenced this issue Feb 24, 2020
@wnvko
fix(date-picker): move isReaquired to ngAfterViewChecked, #6471
bcaba87
wnvko added a commit that referenced this issue Feb 24, 2020
@wnvko
test(date-picker): fix failing test, #6471
dd59b28
wnvko added a commit that referenced this issue Mar 5, 2020
@wnvko
fix(date-picker): updae ngModel on outside click, #6471
faf684e 
If we drop down the calendar when input has no value,
onBlur gets called but we do not call onTouchCallback
which is correct. However if after we click outside the
input the model is never validated. This is why we
should validate model, in this case, and in onClosing event.
wnvko added a commit that referenced this issue Mar 5, 2020
@wnvko
test(date-picker): update test to correctly click, #6471
72a0584
wnvko added a commit that referenced this issue Mar 5, 2020
@wnvko
test(*): allow UIInteraction to click everywhere, #6471
5c2b2d1
wnvko added a commit that referenced this issue Mar 5, 2020
@wnvko
fix(date-picker): stop input self validation, #6471
626def8
wnvko added a commit that referenced this issue Mar 5, 2020
@wnvko
test(date-picker): fix failing test, #6471
14fac85
wnvko added a commit that referenced this issue Mar 5, 2020
@wnvko
test(time-picker): fix failing tests, #6471
4ab6386 
# Conflicts:
#	projects/igniteui-angular/src/lib/time-picker/time-picker.component.ts
wnvko added a commit that referenced this issue Mar 5, 2020
@wnvko
fix(date-picker): move isReaquired to ngAfterViewChecked, #6471
eaa413d
wnvko added a commit that referenced this issue Mar 5, 2020
@wnvko
test(date-picker): fix failing test, #6471
57c9c75
wnvko added a commit that referenced this issue Mar 5, 2020
@wnvko
test(date-picker): properly focus with no click, #6471
973dbea
@wnvko wnvko mentioned this issue Mar 5, 2020
Merged
14 tasks
wnvko added a commit that referenced this issue Mar 5, 2020
@wnvko
test(date-picker): add test for reactive form, #6471
d2c3096
wnvko added a commit that referenced this issue Mar 5, 2020
@wnvko
fix(date-picker): fix validation of date picker, #6471
7065375 
# Conflicts:
#	projects/igniteui-angular/src/lib/date-picker/date-picker.component.ts

# Conflicts:
#	projects/igniteui-angular/src/lib/date-picker/date-picker.component.ts
wnvko added a commit that referenced this issue Mar 5, 2020
@wnvko
test(date-picker): add test for control value accessor, #6471
2c89abc 
# Conflicts:
#	projects/igniteui-angular/src/lib/date-picker/date-picker.component.spec.ts
wnvko added a commit that referenced this issue Mar 5, 2020
@wnvko
fix(time-picker): implement control value accessor, #6471
2e02f39 
# Conflicts:
#	projects/igniteui-angular/src/lib/time-picker/time-picker.component.ts

# Conflicts:
#	projects/igniteui-angular/src/lib/time-picker/time-picker.component.ts
wnvko added a commit that referenced this issue Mar 5, 2020
@wnvko
test(igx-calendar): fix failing test, #6471
6b0b7d9
wnvko added a commit that referenced this issue Mar 5, 2020
@wnvko
fix(date-picker): updae ngModel on outside click, #6471
0e16cb2 
If we drop down the calendar when input has no value,
onBlur gets called but we do not call onTouchCallback
which is correct. However if after we click outside the
input the model is never validated. This is why we
should validate model, in this case, and in onClosing event.

# Conflicts:
#	projects/igniteui-angular/src/lib/time-picker/time-picker.component.ts
wnvko added a commit that referenced this issue Mar 5, 2020
@wnvko
test(date-picker): update test to correctly click, #6471
f1091e8
wnvko added a commit that referenced this issue Mar 5, 2020
@wnvko
test(*): allow UIInteraction to click everywhere, #6471
925e3ff 
# Conflicts:
#	projects/igniteui-angular/src/lib/test-utils/ui-interactions.spec.ts
wnvko added a commit that referenced this issue Mar 5, 2020
@wnvko
fix(date-picker): stop input self validation, #6471
274b880
wnvko added a commit that referenced this issue Mar 5, 2020
@wnvko
test(date-picker): fix failing test, #6471
8a2397d
wnvko added a commit that referenced this issue Mar 5, 2020
@wnvko
test(time-picker): fix failing tests, #6471
18a543f 
# Conflicts:
#	projects/igniteui-angular/src/lib/time-picker/time-picker.component.ts

# Conflicts:
#	projects/igniteui-angular/src/lib/time-picker/time-picker.component.ts
wnvko added a commit that referenced this issue Mar 5, 2020
@wnvko
fix(date-picker): move isReaquired to ngAfterViewChecked, #6471
7f61ed4
wnvko added a commit that referenced this issue Mar 5, 2020
@wnvko
test(date-picker): fix failing test, #6471
eb6be5b
wnvko added a commit that referenced this issue Mar 5, 2020
@wnvko
test(date-picker): properly focus with no click, #6471
26482c7
@wnvko wnvko mentioned this issue Mar 5, 2020
Merged
14 tasks
Lipata pushed a commit that referenced this issue Mar 6, 2020
@wnvko
fix(date-picker, time-picker): add visual validity state and required…
63acbaf 
… asterisk #6471, #6846 (#6722)
Lipata pushed a commit that referenced this issue Mar 6, 2020
@wnvko
fix(date-picker, time-picker): add visual validity state and required…
7bb323c 
… asterisk #6471, #6846 (#6722)
Lipata pushed a commit that referenced this issue Mar 6, 2020
@wnvko
fix(date-picker, time-picker): add visual validity state and required…
72ca1ae 
… asterisk #6471, #6846 (#6722)
@wnvko wnvko mentioned this issue Mar 6, 2020
Merged
14 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@Lipata Lipata

@damyanpetev damyanpetev

@wnvko wnvko

Labels
💥 severity: critical 🐛 bug Any issue that describes a bug 🕐 time-picker 📅 date-picker version: 8.2.x version: 9.0.x version: 9.1.x ✅ status: resolved Applies to issues that have pending PRs resolving them, or PRs that have already merged.
Projects
None yet
Milestone
No milestone
4 participants
@kdinev @Lipata @damyanpetev @wnvko