How to set 2 default dates

[vin]

I need to set 2 default dates which is already known ex sept 1 2020 to sept 30 2020

I want the user to select between those 2 dates only

can i blackout other dates which is not in the known ranges

i was trying to use blur and change from ur example in documentation for validations but getting error

RROR TypeError: Cannot read property 'querySelector' of null

    at select (dom.js:249)

    at FormValidator.push../node_modules/@syncfusion/ej2-inputs/src/form-validator/form-validator.js.FormValidator.getInputElement (form-validator.js:205)

    at FormValidator.push../node_modules/@syncfusion/ej2-inputs/src/form-validator/form-validator.js.FormValidator.validateRules (form-validator.js:498)

    at FormValidator.push../node_modules/@syncfusion/ej2-inputs/src/form-validator/form-validator.js.FormValidator.validate (form-validator.js:176)

    at NewProgramComponent.push../src/app/programs/new-program/new-program.component.ts.NewProgramComponent.onChange (new-program.component.ts:161)

    at Object.eval [as handleEvent] (NewProgramComponent.html:24)

    at handleEvent (core.js:29239)

    at callWithDebugContext (core.js:30309)

    at Object.debugHandleEvent [as handleEvent] (core.js:30036)

    at dispatchEvent (core.js:19859)

 <ejs-daterangepicker #program_schedule required title="Program Name" [(ngModel)]="programScheduleValue"

                name="program_schedule" id="program_schedule" placeholder='Select a range' [startDate]='start'

                [endDate]='end' (blur)="onFocusOut()" (change)= "onChange($event)"></ejs-daterangepicker>

[Sureshkumar P]

Hi Vin, 

 

Greetings from Syncfusion support. 

 

We can restrict the selectable dates within 2 dates (predefined range). Using min and max date property. 

 

Please refer the code example: 

<ejs-daterangepicker placeholder='Select a range' [min]='minDate' [max]='maxDate'></ejs-daterangepicker> 

 

[sample.ts] 

public minDate: Date = new Date('1/15/2017'); 

    public maxDate: Date = new Date('12/20/2017'); 

 

 

Please follow the online sample link to achieve your requirement: https://ej2.syncfusion.com/angular/demos/#/material/daterangepicker/date-range  

 

To know more about min and max property, please follow the how to section documentation link: https://ej2.syncfusion.com/angular/documentation/daterangepicker/range-selection/  

 

Regards, 

Sureshkumar P