Now button is missing in DateTimePicker

[Guillermo Goberna]

Dear all, 

In asp.net mvc js1, the datetimepicker had a "now" button that was filling the current day and time .e.g. 01/01/2019 14:13

Is this option available in JS2 ? I can not find it, just the "Today" button, but it put 12:00 as an hour always, no matter if is 19:32

That option was very nice in my case as an "Start now" the task, and "End now" the task..

Thank you.

[Silambarasan I]

Hi Guillermo, 

 

Thank you for contacting Syncfusion support. 

 

We have looked into the reported query and your requirement (“Need to update the current date with current time value as like in EJ1 DateTimePicker”) can be achievable as a work around solution. In the that, we have updated the current date and time value in DateTimePicker input when clicking the “Today” button. Please refer the below code example. 

 

 

@Html.EJS().DateTimePicker("datetimepicker").Width("250px").Open("onOpen").Render() 

 

<script> 

    function onOpen(args) { 

        this.footer.querySelector('.e-today').addEventListener('click', function () { 

            var dateTimeInstance = document.getElementById("datetimepicker").ej2_instances[0]; 

            dateTimeInstance.value = new Date(new Date().toLocaleString()); 

        }); 

    } 

</script> 

 

 

 

 

Please refer the below sample for your reference.
http://www.syncfusion.com/downloads/support/directtrac/230572/ze/DateTimePicker_today1327817718 

 

To know more about DateTimePicker, please refer the below UG documentation link.
https://ej2.syncfusion.com/aspnetmvc/documentation/datetimepicker/getting-started-mvc/ 

 

Could you please check the above solution and get back to us if you require further assistance? 

 

Regards, 

Silambarasan 

[Matt Cullinan]

When using this solution change is triggered twice. Once to set the date and a second time setting the time. Is there a work around?

Code Example:

 

@(Html.EJS().DateTimePickerFor(model => model.DateField)
                                .Open("onOpen")
                                .Change("change")
                                .ShowTodayButton()
                                .Placeholder("Select date and time dropped")
                                .Render())

<script>

function onOpen(args){

this.footer.querySelector('.e-today').addEventListener('click', function () {
        var thisInstance = this.inputElement.ej2_instances[0];
        thisInstance.value = new Date(new Date().toLocaleString());
 });
}
function change(args){
     console.log("value: " + args.value)
}

</script> 

Console...

value: Tue Aug 02 2022 00:00:00 GMT-0500

value: Tue Aug 02 2022 09:32:35 GMT-0500

[UdhayaKumar Duraisamy]

Hi Matt,

In DateTimePicker component the Change event will triggers for both Date and Time value get changed or either selected in calendar or time popup. This is the intended behavior of our component.

Regards,

Udhaya Kumar D