Completed
Last Updated: 25 Jan 2023 13:41 by ADMIN
Release 4.0.0 (18 Jan 2023) (R1 2023)
Philip
Created on: 03 Nov 2020 15:05
Category: DateInput
Type: Feature Request
25
Paste date with the same format

My users want to paste dates in the date inputs (date pickers in our case). This seems to work in Kendo, but does not work in Blazor, even when the format of the copied data matches the Format of the component.

 

<p>
    Try copying this date which is valid in the current format: 23/03/1998
    <br />
    then paste it in the date picker and see what happens to the <code>TheDate</code> field
</p>

@TheDate
<br />

<TelerikDateInput @bind-Value="TheDate" Format="dd/MM/yyyy" /> @TheDate.ToString("dd/MM/yyyy")

@code {
    DateTime TheDate { get; set; } = new DateTime(2019, 11, 27, 02, 03, 44);
}

---

ADMIN EDIT

Allowing the paste into the DateInput (and by extension date picker,...)  would have a lot of cases to control and that is why we have not yet enabled it. If the format is M/d/yyyy, for example, validation for numbers lower or equal to 12 would not be possible when the month is regarded. If the user pastes 8/2/2020 could mean two things - 8th of February 2020 or 2nd of August 2020. This might cause issues as the data that goes to the database might be incorrect and causing the application to misbehave.

That being said, how would you suggest handling the pasting of dates in the component. How would you like from us to handle the format difference of the dates? Please comment below.

---

13 comments
ADMIN
Dimo
Posted on: 25 Jan 2023 13:41

Hi Chrysostomos,

The DateInput copy-pasting currently works in a similar way as a regular textbox - to replace the whole value, the user needs to select the existing whole value first. The only exception is if the DateInput is empty. In this case, there is no value, but the whole mask may not be fully selected on focus. I have started a conversation about this with our UX designers, but this will have impact on several products, so the decision will take time.

Currently, if users expect to select the whole DateInput value with a single click, then advise them to click on an associated <label>. I assume there is one already, so that the app meets accessibility requirements.

Regards,
Dimo
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

web
Posted on: 23 Jan 2023 10:16

In my view the users selects a control with a single way. They single click inside the control. They don't care about segments. 

All the others cases are exceptions (in my view). 

In this main case, copy paste doesn't work.

I strongly believe that's the case.

 

ADMIN
Dimo
Posted on: 20 Jan 2023 08:56

Hello Chrysostomos,

DateInput copy-paste works like this:

  • Focus (select) a single date segment to paste a different value of the same segment.
  • Select the whole DateInput value to paste a full different value of the same format.

Users do the same thing with regular free text textboxes, yes?

There are several ways to select the whole textbox value, as always:

  • tab to focus
  • click on an associated <label>
  • triple mouse click
  • drag the mouse cursor to select all segments

I will check with the devs and UX guys if we can (or should) support pasting of full values on a single segment. If yes, I will follow up.

Regards,
Dimo
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

web
Posted on: 19 Jan 2023 11:21

hello, 

you should reopen this issue or create a new one. This feature is not fixed yet. 

when you click inside the control and you paste the value it doesn't get pasted.

you need first to click cntr+a and when cntrl+v to work.

your blazor dev team needs new guidance for sure... we were waitning neer 2 years for this things and still are not right implemented....

 

web
Posted on: 18 Jan 2023 23:13
is there a demo of this working? In your demo site it isn't working...
John
Posted on: 25 Jul 2022 15:26

Hi,

Allowing users to paste in dates is a boon for data entry. I have a use case where customers may collect data into spreadsheets and then copy and paste the data into our Telerik Blazor form. Currently, they can paste in all their data except date. Thanks!

--John

web
Posted on: 19 May 2022 06:53

PLz vote for this 

https://feedback.telerik.com/blazor/1565785-make-you-date-inputs-datepickers-e-t-c-work-with-text-input-like-all-your-javascipt-controls

web
Posted on: 19 May 2022 06:39
The link that propose to hide the input field is so funny....
Maybe we sould hide telerik controls....

Your datepickers functionality is so wrong...
Dale
Posted on: 29 Mar 2022 14:11
Also looking for this capability. Its very painful for our end users to always need to type out the date.
ADMIN
Marin Bratanov
Posted on: 25 Mar 2021 07:12

Hello Philip,

You may then find useful this example of hiding the built-in input of the pickers so you can use your own: https://docs.telerik.com/blazor-ui/knowledge-base/datepicker-hide-input

As to what and how can be done, at this point I can't say for sure. This needs detailed research before we can commit to something. The JS dates are not like the C# dates and formats don't match between them. On a render fragment component - at this point I find it highly unlikely, because you can't capture pasting in a non-editable element, and offering an editable element will either let the end user destroy the markup (unacceptable), or the element has to be an input (or textarea) which means it can't have child content, and it will consume events and focus, which is also unacceptable. You can find some examples on handling pasting and the caveats with that in this sample project (see also the readme file).

Regards,
Marin Bratanov
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Philip
Posted on: 25 Mar 2021 03:42

Hello Maurin

 

Sorry I didnt see I hadn't responded to your qu above.

Maybe a way to implement the pasting is via js and could force/infer the dateTime format via parameter (i.e. you could have a parameter called "PasteUICulture" or something, then the onus is on the developer).

 

Or.... Telerik could make a component called <TelerikPasteArea> which accepts renderFragments / wraps around ANY component(s), defines the div area where values can be pasted, and binds to the clipboard/pasted value. Then the context value of the TelerikPasteArea component could be utilised within its child components.

 

re. the day/month issue, at the moment, our solution for date input is just to use a telerik textbox for dates, and utilise the ValueChanged event to validate the bound date string / control the ui logic as user types.

 

ADMIN
Marin Bratanov
Posted on: 24 Mar 2021 13:17

Hello Liero,

Your vote is taken into account and that raises the priority of the request. We do have to, however, keep our entire customer base in mind when prioritizing tasks, and we need to implement those that will provide the biggest benefit for the most people. 

I thank you for your suggestion and it is something that we will definitely consider when we implement such a feature. What I can say at this point is that an added round-trip to C# before parsing the date can cause latency and lag for the end user which is also not ideal. Pasting is actually a very complicated matter (if nothing else, the browser limits when and how you can get paste data in code very much), and parsing dates is also a complicated matter.

Regards,
Marin Bratanov
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Liero
Posted on: 23 Mar 2021 12:32

I have the same request. I simply need copy&paste from one date input/picker to another.

My customer is quite disappointed of not directly angry as they have to type manually a lot of dates now.

My suggestion is:

If you can't parse it using javascript properly, then use C# DateTime.TryParseExact with the format specified and then DateTime.Parse with CurrectCulture as a fallback.

They also don't like how the date input handle handles dot or / key (depending on separator): typing 1/1/2020 work, but 9/9/2020 doesn't, try it yourself here. And I agree, that's terrible ;(