How to clear date values in the input field?

Question

Hai Team,

I have writtten reset function for all input values in the Angular 4 Typescript project.But the date values are not clearing after clicking the reset button.Please give me a solution to clear the date fields ASAP.

We are expecting a quick solution from your side.

Herewith I attach the Html code and Typescript code below.

HTML Code:

Input Field

Button

<button class="btn btn-danger btn-space pull-right" style="margin-left:5px;width:100px;" (click)="reset()">Cancel</button>

Typescript Code:

reset() {

debugger;

this.safetyenvinstance = new SheSafetyEnvIncidentModal();

this.businesslocationfieldsvalues = 0;

this.safetytypefieldsvalues = 0;

this.valuestreamfieldsvalues = 0;

this.safetyenvinstance.IncidentDateTime = new Date;

this.safetyenvinstance.ReportedDateTime = new Date;

}

Regards,
Sridhar

Deepa Loganathan · Answer

Hi Sridhar,   
   
   
Thanks for contacting Syncfusion Support.   
   
  
We have looked into the code shared in your last update and noticed that you have used new Date() constructor to reset the value of Datetimepicker. Passing the new Date() would set the value to today’s date.   
  
If you wish to reset the value of Datetimepicker, you need to set null to the Datetimepicker’s model value as given in the below code.   
  
[datetimepicker.component.ts]   




import { Component, ViewChild, AfterViewInit,  } from '@angular/core';   
import { EJAngular2Module, DateTimePickerComponent } from 'ej-angular2';   
   
@Component({   
    selector: 'ej-app',   
    templateUrl: './datetimepicker.component.html',   
})   
export class DateComponent {   
    @ViewChild('datetime')   
    public datetime: DateTimePickerComponent;   
    constructor() {   
    }   
    reset() {   
       this.datetime.widget.option("value",null);   
     }   
}   
  
For your convenience, we have prepared a sample based on your requirement.   
   
Sample: http://www.syncfusion.com/downloads/support/forum/140280/ze/DateTimePicker_Reset-2036143220    
   
  
Please, let us know if you need any further assistance.   
   
  
Regards,   
  
Deepa L.