Is there a way to set DateTime to now when clicked on Today button in DateTimePicker?

I am using Syncfusion Angular DateTimePicker component in my app. As you know there is a "Today" button on the calendar. When I click on "Today" button in calendar, I get todays date added to the input. But, I want the current time to be updated as well. How can I do this? Is there a way to set time and date together on Today Button click?


I know I can do that on onChange() event, but, how can I know that the user clicked on Today ​button? I want to set datetime to now only when Today button is clicked. 


1 Reply 1 reply marked as answer

PK Priyanka Karthikeyan Syncfusion Team September 13, 2023 12:07 PM UTC

Hi Amarender Tangella,

To achieve your requirement, you can bind a click event to the 'Today' button within the open event. In the click action, you can set the component's value to new Date() to set it to the current date and time. Below is a code snippet and a sample for your reference

<ejs-datetimepicker #datetime (open)="onOpen($event)"></ejs-datetimepicker>

onOpen(args: any) {

    if (args.popup.element.getElementsByClassName('e-today')[1].innerText == 'Today') {

      args.popup.element.getElementsByClassName('e-today')[1].addEventListener('click', this.handleButtonClick);

    }

  }

  handleButtonClick = () => {

    this.datetime.value = new Date();

  };

Sample: https://stackblitz.com/edit/angular-wxndvq-xykajf?file=src%2Fapp.component.html,src%2Fapp.component.ts

Documentation referencehttps://ej2.syncfusion.com/angular/documentation/api/datetimepicker/#open

https://ej2.syncfusion.com/angular/documentation/api/datetimepicker/#value

If you need any further assistance, Please let us know. We are happy to assist you further.

Regards,

Priyanka K


Marked as answer
Loader.
Up arrow icon