Stop the auto-formatting of the datetime and time picker

1 Answer 130 Views
TimeDurationPicker
John
Top achievements
Rank 2
Iron
Iron
Veteran
John asked on 21 Jul 2023, 04:38 PM
We have a couple places in our code where we are using a kendo time or datetime picker and the entry field can accept either a properly formatted date or a "relative" code we came up with.  example:  0:+1 = this hour, one minute from now.  0:0 is now.  You get the idea.  To support someone entering an actual value, two-digit numbers are considered literal.  This is a problem with these controls because they appear to be auto=formatting 0:0 to 0:00.  We have a work-around by adding a + to the front or a T to the front (we pass the result as unix time format).  However, it is desired that we don't have to do this.  Is there a way to stop the control from doing this?

Note:  I picked "timedurationpicker" as the tag because you don't seem to have the correct tag for timepicker available.

Our code:
    function parameterEditor(container, options) {
        switch (options.model.ObjectFieldTypeID) {
            case @((int)ObjectFieldType.Types.Boolean):
                boolEditor(container, options);
                break;
            case @((int)ObjectFieldType.Types.Integer):
                numericEditor(container, options, 0);
                break;
            case @((int)ObjectFieldType.Types.Double):
                numericEditor(container, options, 2);
                break;
            case @((int)ObjectFieldType.Types.DateTime):
                dateTimeEditor(container, options, "kendoDateTimePicker", "M/d/yyyy H:mm", "H:mm");
                break;
            case @((int)ObjectFieldType.Types.Date):
                dateTimeEditor(container, options, "kendoDatePicker", "M/d/yyyy");
                break;
            case @((int)ObjectFieldType.Types.Time):
                dateTimeEditor(container, options, "kendoTimePicker", "H:mm");
                break;
            default:
                stringEditor(container, options);
        }
    }

    function dateTimeEditor(container, options, type, format, timeFormat) {
        $('<input id=' + options.field + '>')
            .appendTo(container)[type]({  /* dynamically choose the type of kendoXXXPicker (code other than "format" is universal) */
                value: options.model.DefaultValue,
                format: format,
                timeFormat: timeFormat,
            })
            .data(type);
        $("#" + options.field).on("change", function () {
            options.model.set(options.field, kendo.toString($(this).val(), format) || $(this).val());
        });
    }

1 Answer, 1 is accepted

Sort by
0
Neli
Telerik team
answered on 26 Jul 2023, 01:18 PM

Hello John,

As far as I understand you need to be able to enter 0:0 for the hour and minutes in the DateTimePicker and TimePicker. Is this correct? 

From the provided snippet I see that the format set on your end is 'H:mm' which should allow you to set the hours with a single digit. If you need to set single digit for the minutes, you can try the following format: 'H:m'. This is demonstrated in the Dojo linked here

Please let me know if the provided suggestion is helpful to achieve the desired result. 

Regards,
Neli
Progress Telerik

Stay tuned by visiting our public roadmap and feedback portal pages! Or perhaps, if you are new to our Kendo family, check out our getting started resources
John
Top achievements
Rank 2
Iron
Iron
Veteran
commented on 03 Aug 2023, 01:59 PM

I'm not sure why, but although your sample works in the dojo, I tried the exact same settings before I even posted the question and it's not working in our project.  Perhaps it's something related to the version of kendo?  shrug.

 

Neli
Telerik team
commented on 08 Aug 2023, 08:42 AM

Hi John,

Could you please confirm which is the version used on your side, so I could test using the same kendo version?

Looking forward to your reply.

Regards,

Neli

John
Top achievements
Rank 2
Iron
Iron
Veteran
commented on 08 Aug 2023, 04:14 PM

2023.2.718
Neli
Telerik team
commented on 11 Aug 2023, 12:01 PM

Hi John,

In the dojo example in my previous reply the used version is the same - 2023.2.718 and the issue is not replicated. Thus, in order to be able to suggest a possible reason for the issue I would like to ask you to modify the example in order to replicate the behavior the way it is on your side and send it back. This way we could troubleshoot locally and advise you further.

Regards,

Neli

Tags
TimeDurationPicker
Asked by
John
Top achievements
Rank 2
Iron
Iron
Veteran
Answers by
Neli
Telerik team
Share this question
or