Completed
Last Updated: 07 Oct 2020 12:45 by ADMIN
Release 2020.R3.SP.next
Raff
Created on: 02 Jun 2020 14:43
Category: DateTimePickers
Type: Bug Report
0
TimePickerFor not showing time

Hi,

 

I'm having an issue with the TimePickerFor control, it doesn't show the time, only a strange format.

 

When I declare the control:

            @(Html.Kendo().TimePickerFor(m => m.ShiftStartDt)
                .Deferred()
            )

 

it only shows a forma of "h:mm tt" instead of the time from the model

 

When I change the control to a datetime picker, it works fine but I don't want to see the date, only the time.

This works:

            @(Html.Kendo().DateTimePickerFor(m => m.ShiftStartDt)
                .Deferred()
            )

 

I have debugged the model and the data is correct,

        [Display(Name = "Start Time")]
        public DateTime ShiftStartDt { get; set; }

 

I have even tried changing the model to TimeSpan but it didn't help

I tried setting the format also on the control and using jquery:

        $("#ShiftStartDt").kendoTimePicker({
            format: "HH:mm"
        });

 

still always shows "h:mm tt" always, no matter what I do

 

Regards

Raff

7 comments
ADMIN
Silviya Stoyanova
Posted on: 19 Jun 2020 12:58

Hello Rafal,

I am glad to read that the workaround even temporarily will suit your project purposes.

The thread will not be updated and the ticketing system will automatically close this ticket in case of inactivity for a week. However, the Bug report in our Feedback Portal is linked to the GitHub issue, thus, the item's status will be updated automatically. It is a matter of preference whether you will follow the GitHub or the Feedback portal for updates.

Kind Regards,
Silviya Stoyanova
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
Raff
Posted on: 12 Jun 2020 13:41

Hi Silviya,

 

Thank you, using the hidden field workaround worked for me.

Will this thread be updated when the TimePicker is fixed so that I may remove the workaround?

 

Regards

Raff

ADMIN
Silviya Stoyanova
Posted on: 11 Jun 2020 15:36

Hello Rafal,

Please accept my apologies for the delayed response.

An option could be setting a hidden input in the partial view

@Html.HiddenFor(m=>m.ShiftStartDt1, new { id="my-hidden"})
and get the value as:
function onTaskEditRefresh(e) {
         var date = kendo.parseDate( $("#my-hidden").val())
        $("#ShiftStartDt1").kendoTimePicker({
            format: "HH:mm",
            value: date
        });
You will find attached the updated project.

 

Regards,
Silviya Stoyanova
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
Attached Files:
Raff
Posted on: 04 Jun 2020 14:51

Hi Silviya,

 

Thank  you for the update, unfortunately the work around won't work in our scenario since the control is part of a Partial View popup.

I order to get around the CSP limitation we had to create scripts to load with the main page in order to wrap them using a nonce.

eg.

<script nws-csp-add-nonce="true">

</script>

 

Since the controls are on a partial view, we cannot load scripts with the partial view, this is why DeferredScriptsFor will also not work in a partial.  In order to be able to use the controls we worked out that we can initialise the controls using the Refresh event of the Kendo Window control.

I have updated the TimePicker project attached to help understand it better.

 

So far all the controls we have used using this method have all worked except for the TimePicker.

 

Regards

Raff

Attached Files:
ADMIN
Silviya Stoyanova
Posted on: 04 Jun 2020 10:31

Hello Rafal,

I have discussed the described issue with my team and it seems to be a bug. I have logged in it into the Feedback Portal and into the GitHub repository, where you could track its progress.

As a workaround, I would suggest defining a value for the TimePicker input like that:

<script>
   var value = "@(Html.Raw(Model.ShiftStartDt1))"

    $("#ShiftStartDt1").kendoTimePicker({
        format: "HH:mm",
        value: kendo.parseDate(value)
    });
</script>

Finally, I added some Telerik points to your account for bringing the issue to our attention.

Kind Regards,
Silviya Stoyanova
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
Raff
Posted on: 03 Jun 2020 13:50

Hi Silviya,

 

I can see it working with the DeferredScriptsFor in your project but unfortunately I can't use that option because the control is in a popup window which is loaded using a partial view and thus would fail the Content Security Policy.

I have been having to do a lot of workarounds in order for our application to pass CSP as the Telerik controls fail CSP if you use them as shown in the demos, this issue has been raised but there is no timeline as to when Telerik will resolve the problem according to your knowledge base.

 

I have updated the project you provided which illustrates the issue, I also updated the Telerik version just in case it was a problem introduced in the new version.

I have also added a DateTimePickerFor control using the same method which is working without a problem.

Hopefully you can help me get the TimePicker working using this method also.

 

Regards

Raff

Attached Files:
ADMIN
Silviya Stoyanova
Posted on: 03 Jun 2020 12:23

Hello Rafal,

Thank you for the provided code snippets!

I have prepared a sample project and it works as expected on my side.  The only difference is that I am using DeferredScriptsFor method to render the deferred initialization.

Could you please modify the project with the faulty behaviour that you are facing and send it back for further examination?

Kind Regards,
Silviya Stoyanova
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
Attached Files: