Unplanned
Last Updated: 25 Mar 2021 07:12 by ADMIN
Philip
Created on: 03 Nov 2020 15:05
Category: DateInput
Type: Feature Request
8
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.

---

4 comments
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 ;(