ng2-ui / datetime-picker

Angular2 DateTime Picker
https://ng2-ui.github.io/#/datetime-picker
MIT License
121 stars 62 forks source link

min-date issue #173

Closed ash53 closed 7 years ago

ash53 commented 7 years ago
  1. If I set [min-date] to present date with new Date(), it won't allow selecting the current date, it lets select from the next date.

  2. If I have two date fields, one start date and another end date, how do I pass the selected start date as the minimum date for end date? Currently, if I do this:

    
    <input  name="start_dt" placeholder="Start Date*" class="form-control" type="text"
                      formControlName="start_dt" ng2-datetime-picker date-only="true" [min-date]="minStartDate" [(ngModel)]="startDate"
                      date-format="MM/DD/YYYY">
    <input  name="end_dt" placeholder="End Date*" class="form-control"  type="text"
                      formControlName="end_dt" ng2-datetime-picker date-only="true" [min-date]="startDate" [default-value]="startDate"
                      date-format="MM/DD/YYYY">


I can get it to work, but using ngModel creates other issues, for start date it selects the value correctly,  {{myForm.value.start_dt}} gives the correct value in (MM/DD/YYYY) format, but in form value {{myForm.value | json}} it gives wrong date, for  example: if I select "03/21/2017", I get {{myForm.value.start_dt}}="03/21/2017", but in {{myForm.value | json}} I get--> "start_dt": "2017-03-20T18:00:00.000Z", and this is the value that is being stored in 

Plunker: https://plnkr.co/edit/kMrpeTd1ZfH6Xa4NwEUd?p=preview
allenhwkim commented 7 years ago

@ash53 thanks for reporting this Currently min-date and max-date is exclusive although I am not sure this is suitable.

To go around it, you can set minDate as yesterday.

The second issue, we have an issue reported already #143

allenhwkim commented 7 years ago

The logic seems correct. For current date as minDate, you need to set time to 00:00:00

  public isDateDisabled(date: Date) {
    let dateInTime  = date.getTime();
    this.disabledDatesInTime =
      this.disabledDatesInTime || (this.disabledDates || []).map(d => d.getTime());

    if (this.minDate && (dateInTime < this.minDate.getTime())) {
      return true;
    } else if (this.maxDate && (dateInTime > this.maxDate.getTime())) {
      return true;
    } else if (this.disabledDatesInTime.indexOf(dateInTime) >= 0) {
      return true
    }

    return false;
  }