This is why I will not use the DateRangePicker

[Frederic]

We try to always use a kendo component for our needs. 
But, for the first time, the kendo component we need in the framework is totally unusable, and we will not use it.

Instead, we will create a custom range picker, using 2 DatePicker.

First, when the range open, the 2 calendars are always based on the current day, not the range start / end.  We see the current month on the left side, and next month on the right.  We we should see, is the "start" month on the left when we click the "start" zone, and the end month on the right when we click the "end" zone to open it.

Also, we can't only change the "start" or "end" easily, we always need to re-select the whole range.

And, depending on the previous range, + the new range, sometimes, the "end" value becomes null / undefined %?!
And we may need to re-select the start date and/or end date twice, it's not easy to understand what is happening during a simple selection.

Finally, we tried to catch the "change" events, change the range manually, but there's nothing we can do to make that component easy to use for users.

https://dojo.telerik.com/@foxontherock/UKureVOy/2

Try to select a range, between 10 and 15.
Then, re-open it, and select 12 to 17.
Do you understand what just happened ?!?!? No one can. 2nd click becomes the first one, and the third click becomes the 2nd one, the first is ignored, and we see the "null" end date !?!?.

[Laura]

Any update on this? On GitHub the bug shows as 'unassigned' with the last update on 20th of May. It would be great to use this but we are having the same problems.

[Nikolay]

Hi Laura,

This has not been handled yet, however, its priority has been lifted 2 days ago and it will be processed faster. I recommend subscribing to the item to receive notifications for any updates

Regards,

Nikolay

[Lee]

Any update? It's been a few years since this was reported. 

[Georgi Denchev]

Hello, Frederic,

Thank you for the provided details and Dojo!

I'll start with the second problem. This appears to be a bug with the DateRangePicker and I have logged a public item in our Feedback Portal, as well a public issue in our public GitHub repository. You can track the progress of the fix there. I have also updated your Telerik Points as a sign of gratitude for reporting this behavior to us and providing a runnable example and explanation on how to reproduce the problem.

Please accept my apologies about the caused incovenience.

In regards to your first point, this is how the DateRangePicker is designed to work so I'm afraid I can't provide you with any solution to "separate" the start and end date calendars. Using two separate DatePickers(as you mentioned) would be the correct way to go in this case.

Let me know if you have any questions.

Best Regards,
Georgi Denchev
Progress Telerik

[Frederic]

Thank you for your response.

It's fine that you will fix the strange behavior that occurs when re-selecting in the middle of the range!

About the default calendar we see when we open it...

I don't mean that both calendar should be independant. 
I understand that they should be 2 consecutive months.

But, in that case: The selected range is from August to October, and we are in December.

If I click the "start" date, it should open and display august-september, not december-january, to see the start date on the left side.

Now, for the "end date"... if I can't change only the change date, you can open like if I click the start date.

But, if I can change "only" the end date, by clicking on the end date, then, it should open by displaying september-october, to see the "end date" on the right side.

But, because we always need to re-pick both, you can also open on august-october like when we click on the start date...
But please, do not open on "current month" + "next month" every time!

I think the months displayed when opening should be based on the current selection.

Thank you!

p.s. Finally, we did our solution with 2 independent calendars datepicker, and it works fine, by setting the "min" and "max" of the other, according to the section of the one that changes.

[Georgi Denchev]

Hi, Frederic,

Thank you for clarfying the issue, I can see your point. Unfortunately, the Devs are currently out of office so I cannot ask for additional details in regards to this behavior. I'll mark this thread for an additional answer and I'll let you know once I have more information on the matter.

In the meantime, you can update the dateView object to open the calendar on the current selection manually.

        var kpicker = $('#sample1')[widget](opt).data(widget);
        // Update the dateView to display the month of the current selection(beginning from the start date).
        kpicker.dateView.value(kpicker.range().start);

Updated Dojo:

https://dojo.telerik.com/@gdenchev/OxoqaDAw 

Best Regards,

Georgi

[Georgi Denchev]

Hi, Frederic,

I just wanted to let you know that the second issue has also been confirmed as a bug. I've updated the GitHub issue with additional information.

Thank you once again for reporting this.

Let me know if you have any other questions.

Best Regards,

Georgi

[Lee]

I have tried to use Kendo's DateRangePicker but it lacks a lot of seemingly basic features. I recommend litepicker instead until Kendo gets around to working out the bugs in theirs. 

[Nikolay]

Hi Lee,

Thanks for the heads up.

I have raised the issue's priority so it can be handled sooner.

Regards,

Nikolay