Bug report

When trying to select a value from the modern Kendo UI TimePicker configured with Max and Min ranges, the currently selected value of the TimePicker is not updated.

Reproduction of the problem

1. Go to this Progress Kendo UI Dojo.
2. Open the TimePicker - notice it's at 9:00
3. Click Set
4. Value is set to 00:00.

Expected/desired behavior

The value should be set upon initial selection.

Potential Workarounds

• Use Classic ComponentType
• Turn off animations, and open/close the TimePicker. (Dojo)

Environment

• Kendo UI version: 2024.3.806
• jQuery version: All Supported Versions
• Browser: All

Bug report

Modern DateTime picker messed-up and switches to timepicker when timpicker clicked i nthe back

Reproduction of the problem
1. Dojo: https://dojo.telerik.com/iJESeFUc

2. Click on the Calendar icon

3. Click around the calendar to hit the datepicker in the back

Result:

Environment
Kendo UI version: [all]
jQuery version: x.y
Browser: all

Actual behavior:

User uses down key or mouse scroll to change the time. A 00:00 hour is set instead of chosen hour on blur.

Expected behavior:

A value chosen by user remains selected. It's not changed by the timepicker.

Additional Context:

This problem occurs only when picker.enable(true) is called after component creation and user uses down arrow / mouse scroll to get to the the 'previous' day. When no .enable method is called everything works fine. Please see attached code snippets and gifs.

Dojo link: https://dojo.telerik.com/OZEDuFEg

Bug can be reproduced using the following code snippet:

 $(document).ready(function () {
    // create TimePicker from input HTML element
    var picker = $("#timepicker").kendoTimePicker({
            dateInput: true,
            format: 'HH:mm'
        }).data('kendoTimePicker');
    picker.enable(true)
});

Removing 

picker.enable(true)

fixes the issue

Add the option to be able to highlight today's date in calendar and date pickers.

DatePicker should let developer decide if the chosen day of the month should be persisted from month-to-month.

By default the DatePicker remembers the day of the month the user has selected, and that day gets styled differently even when the user navigates away to a different month: the user selects January 12th and then navigates to August, and the 12th day of August is styled differently too.

But there are many use cases for a DatePicker where it is not appropriate behavior to remember the previously selected day of the month when the user navigates to a different month. Remembering the day can actually make things confusing for the user in applications where this behavior is not the right behavior.

Need a feature  to restrict the days to be displayed in the Kendo UI datetime pickers control.

 For example .   I want to only display say  dates than falls only on Thursday and Sunday  where users can select on that dates and the other dates to be disabled or invincible.

 I want to have a flexibility to change it to other days as well.

Parsing of the users Input (defined by ParseFormats) is stopping, as soon as min date is set. This happens if the date,evaluated by the parsing, is outside the min/max range. 

I would suggest, that parsing takes the min/max boundaries into account. 

The datepicker does not validate the year when selecting a date and prepending the year with a number. However if you put any character after the year it is stripped off. It would be understandable to allow dates that are longer than 4 digits but the picker only goes to 2099.

This causes the date to be returned as null.

date picker should allow read only of text box

The editors do support inline footer's but you can't use an external footer template yet.

Example template:

<script type="text/template" id="datepicker-footer-template">

    "Today: #:kendo.toString(data, 'yyyy-MM-dd')#, Week: #:kendo.recurrence.weekInYear(data,kendo.culture().calendar.firstDay)#"

</script>

Suggestion to add a footer-template configuration option like this:

<input name="Date" data-role="datepicker" data-bind="value: Date" data-format="yyyy-MM-dd" data-week-number="true" data-footer-template="datepicker-footer-template"/>

Jan

An alternate header with Month and Year Dropdowns would be helpful on the DatePicker

I'd like to be able to specify a custom date in the datepicker footer rather than "today".  In financial end of day applications you often want to select the previous business day e.g. the "close date".

DateInput doesn't support fuzzy dates. (Where day/month/year are optional) This is useful in order entry applications where the developer doesn't have control over what information is available from customers and information supplied is inconsistent.

The DateInput controller could have an option to read/submit formatted strings or some kind of strongly typed DTO so that given parts of the DateInput initialize as blank/null.

I want the datetimepicker to pull from the database if a value exists, show nothing if it doesn't, and get the current date and time when user clicks on the calendar icon.   It doesn't get the current time.  It shows midnight.  I can get the datetimepicker to default to today's date (on display) and current time if I don’t try and pull a value from the database.

Is there any possibility to add a new property to the datepicker that will let the user to use a datepicker like the ones used in materializecss framework?

Sample here:
http://materializecss.com/forms.html#date-picker

It would be good if the datetimepicker would allow starting weeks from Monday. This is the standard in certain areas.

The current date time and date-time pickers don't allow for scrolling the data using the mouse scroll. 
This functionality is available in ajax controls this makes a mix web site not consistent in behavior of controls.

In a filter input field I had one blur event
to fix a entered date string.
It wasn't called if the users hit "Enter" instead of cliking the Filter button or hitting TAB which
would cause a blur event.

T. Tsonev asked me to post this to "UserVoice portal":
Maybe an event that is triggered before attempting to read the value from the input.
This will consolidate both handlers in your case.


Below are the two handlers to fix an input field if a blur or Enter key is done/hit:

---

If an input field is changed and the user does a blur (TAB or clicks filter button) after
entering a date
or
hits the enter key without doing a blur.
the FixDate function is called and input field is changed
before the filter popup is submitted
and the Filter works if a date like this is entered:
11/9/2004 0:0
FixDate canges to:
11/9/2004 12:00 AM.

Below is the code I changed:
See the sections with "Fix "
comments.

Maybe they need a on "blurOrEnter"
event so you don’t need to make two tests?  (((, or an event that is triggered before attempting to read the value from the input)))
...
               // Fix - Modified to call a FixDate function.
               // Test for a blur (ie: click or tab to another widget and leave the input field)
               // NOTE: blur doesn't happen when the enter key is hit
               $("[data-role=datetimepicker]").on("blur", function()
               {
                    var element = $(this);
                    FixDate(element);
               });
     
               // Fix - Modified to handle the "Enter" key
               //       and call the FixDate function
               //       to modify the input field from "11/9/2004 0:0" to 11/9/2004 12:00 AM"
               //       before the form is submitted.
               //       This makes the filter work when the enter key is hit
               //       which doesn't cause a blur to happen.
               $("[data-role=datetimepicker]").on("keydown", function(e)
               {
                    // Test for Enter key
                    if (e.keyCode == 13)
                    {
                         var element = $(this);
                         FixDate(element);
                    }
               });
          }
     });

     // Change the date in the filter input field by using 
     // Datej Date.parse.
     // This will change strings like: "0:0" 
     // To: "1/29/2015 12:00 AM"
     // and allow the filter to work
     function FixDate(element) 
     {
          // Get element for datetimepicker
          //var element = $(this);
          // Get widget for datetimepicker
          var widget = element.data("kendoDateTimePicker");

          // See if element has changed
          if (element.val())
          { 
               // Set Text of widget to a Datejs string date from the elements text
               // IE: 11/9/2004 0.0 will be 11/9/2004 12:00 AM
               widget.value(Date.parse(element.val()));

               // Fix by T. Tsonev 01/26/2015
               // make a change happend so new text is used.
               // ie: Use "11/9/2004 12:00 AM" instead of "11/9/2004 0:0"
               widget.trigger("change");
          }
     }

...

---

Bug report

In the DateTimePicker with dateInput:true, if you change the AM/PM using the arrow keys, the day changes as well.

Regression introduced with 2023.2.606

Reproduction of the problem

1. Open this Dojo example - https://dojo.telerik.com/yzuuvxJA/3
2. Select a date
3. Focus AM/PM and press the arrow keys multiple times

Current behavior

The date will change as well

Expected/desired behavior

The date shouldn't be changing

Environment

• Kendo UI version: 2024.3.1015
• Browser: [all]

Bug report

Modern TimePicker popup renders 01 option twice in the popup with the following configuration:

$("#timepicker").kendoTimePicker({
        format: "HH:mm",
        componentType:"modern",
        interval: {
          hour: 1,
          minute: 15
        }
      });

Regression with v.2023.3.1010

Reproduction of the problem

Dojo: https://dojo.telerik.com/aKeJOluk

Expected/desired behavior
01 shall be present only once.

Environment
**Kendo UI version: 2023.3.1010
**jQuery version: 3.4.1
**Browser: [all]