0

I'm trying to use bootstrap's ngbDatepicker in an Angular application to support a non-required date field, but if the field comes in with a date, setting the date to null will result in the field/form being marked as invalid.

Using the code below, if note.expires_on initially has a date and is then set to null, the form is marked invalid:

<input name="expires_on" [(ngModel)]="note.expires_on" ngbDatepicker #datePicker="ngbDatepicker">

I see from the post below that if the date is initialized as null, then a null value will not result in an invalid form, but in my case, initializing as null doesn't seem like an option.

How to mark ngbDatepicker Valid in form even when no value is selected

Community
  • 1
  • 1
scottwpage
  • 21
  • 1
  • 2
  • Can't reproduce, check this plunker where things seems to be working perfectly fine: http://plnkr.co/edit/bdque81d3BO1ZcsoDhc0?p=preview. Please update your question with a modified plunker that actually reproduces the issue. – pkozlowski.opensource May 13 '17 at 07:15

1 Answers1

2

Thanks for the prompt response.

On the plunker you posted, if you highlight the date, hit delete and then enter, the form is marked as invalid, as model is then set to empty string.

I created a plunker having a onChangeDate method that explicitly sets model to null, which seems to fix this issue: http://plnkr.co/edit/mjaNQK0nViVRyKd39kGu?p=preview

scottwpage
  • 21
  • 1
  • 2