calendarng-bootstrapangular9hijri

Date picker: Cannot scroll throug all years using ngbDatepicker

Expected behavior

I want a user to be able to select all years in the year range in the date picker in hijri.

Actual behavior

A user can only choose 15 in the range. Say the range goes from 1436 - 1417, the user would first have to click on 1417, and then he would click the list again and could now select down to 1416. How to I modify the code so a user can scroll from all years and don't have to click multiple times to get to the right year?

enter image description here

Solution

  • All you have to do is to set minDate and maxDate like that:

     <input class="form-control" (click)="d.toggle()" placeholder="yyyy-mm-dd"
                                  [maxDate]="maxDate"  [minDate]="minDate" [startDate]="startDate"
                                  placement="bottom"
                                  name="dp" [(ngModel)]="model" ngbDatepicker #d="ngbDatepicker">

    and in typescript code :

      maxDate ={year: new Date().getUTCFullYear()-16,month: 12, day: 31}
  minDate ={year: new Date().getUTCFullYear()-100,month: 12, day: 31}
  startDate={year: new Date().getUTCFullYear()-20,month: new Date().getUTCMonth(), day: 1}