DateTime Picker Date and Time icon Event Trigger

0 Answers 40 Views
Date/Time Pickers DateInput General Discussions
Top achievements
Rank 1
GOVERTHANAN asked on 27 Nov 2023, 11:37 AM
  I'm using kendo UI for Jquery in that i'm using DateTimePicker for an client requirement i face the challenge which i need to figure it out whether where the user is clicking either on date icon nor the time icon in datetime change event

Telerik team
commented on 28 Nov 2023, 08:18 AM

To determine whether a user is clicking on the date icon or the time icon in a Kendo UI DateTimePicker for jQuery, you can handle the Click Event on SVG Icons, Identify the Clicked Element and implement the open event of the datetimepicker as shown in the following dojo

  <div id="datetimepicker"></div>
$(document).ready(function() {
    var isDateIconClicked = false;
    var isTimeIconClicked = false;

    // Initialize the DateTimePicker
        open: function(e) {
           setTimeout(function() {
                if (isDateIconClicked) {
                    console.log("Date icon was clicked");
                    isDateIconClicked = false;
                } else if (isTimeIconClicked) {
                    console.log("Time icon was clicked");
                    isTimeIconClicked = false;
                } else {
                    console.log("DateTimePicker opened without icon click");
            }, 0); // Short delay

    // Attach click event to date icon
    $(document).on('click', '.k-input-button[aria-label="Open the date view"]', function() {
        isDateIconClicked = true;

    // Attach click event to time icon
    $(document).on('click', '.k-input-button[aria-label="Open the time view"]', function() {
        isTimeIconClicked = true;

No answers yet. Maybe you can help?

Date/Time Pickers DateInput General Discussions
Asked by
Top achievements
Rank 1
Share this question