Unplanned
Last Updated: 17 May 2022 21:17 by Brian Norris
Kim
Created on: 13 Jul 2021 12:41
Category: Calendar
Type: Feature Request
5
TelerikCalendar Select a whole week

Hi,

I try to implement a calendar there i use Range selection mode. I want the user only to click on the start range and then we will set end range in code based on the start range date. 

So i have set an RangeStartChanged event handler and that works but the gui component think i am in select end Range date so i want to exit the selection state after i have select Start date.

Is there anyway to do that?

---

ADMIN EDIT

---

A possible workaround for the time being - use Multiple selection mode of the Calendar and simulate Range selection. Handle ValueChanged event, programmatically add the desired count of dates to the selection and style them as range: https://blazorrepl.telerik.com/cQuzvKbO29J2Tbnt04.

5 comments
Brian Norris
Posted on: 17 May 2022 21:17

Nadezhda,

That is a great example! Thanks for putting that together in the cool REPL for me (and others). That may or may not cover what this particular client is looking for, but it most definitely provides other UI options for dealing with some of these trickier date selection scenarios. Much appreciated!

ADMIN
Nadezhda Tacheva
Posted on: 16 May 2022 10:33

Hi Brian,

Thank you for the follow up and sharing the approach you are currently using!

In the meantime, there is another option that comes to my mind which you can try - use Multiple selection mode of the Calendar and simulate Range selection. Subscribe to the ValueChanged event and get the lastly selected date. Use it as a starting point and add the desired count of dates to the SelectedDates collection. Now, by design, the Multiple selection will apply different styles to the selected dates compared to the Range selection. You can additionally handle the OnCellRender event to override that with some custom CSS.

Here is a runnable sample that demonstrates the described approach: https://blazorrepl.telerik.com/cQuzvKbO29J2Tbnt04

Regards,
Nadezhda Tacheva
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/.

Brian Norris
Posted on: 09 May 2022 15:39

Nadezhda... Thank you for your response - I appreciate it. 

For those coming to this post... The component is definitely working as designed, as I can bind properly and respond to the events properly. My goal was to respond to the RangeStartChanged event and automatically set a RangeEnd date, ending the selection for the user. But that is not possible, and is what I am hoping and voting for here. 

My workaround... In cases where I need this 'automatic' selection, I respond to the RangeStartChanged event, programmatically set the RangeEnd date, and then reset and hide the component, displaying the dates with text. Not optimal, as I love the calendar range display, but at least I can avoid confusion for the user in this manner.

Hoping we can get a way to set start and end dates programmatically and use this component for those 'automatic' scenarios in the near future!

ADMIN
Nadezhda Tacheva
Posted on: 07 May 2022 07:10

Hello Brian,

In Blazor, value binding is wat actually tells the component to take the value of the corresponding field from the view-model and use it. So, either one-way or two-way binding should be used to get/set the component value.

You can indeed subscribe to the RangeStartChanged event of the Calendar which will fire when the user selects new start date. However, the issue in this case is that by current design the component expects user action, confirmation of the end date to close the selection. Before that, it will consider it is still in selection mode, as Kim mentioned in the opener post, and the selection cannot be programmatically closed.

I see you already voted for the feature. This is important as we keep track of the community demand in order to prioritize the upcoming enhancements. You may as well follow the post (in case you haven't) - thus you will be notified for status updates via email and you can easily keep track of the feature status.

Regards,
Nadezhda Tacheva
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/.

Brian Norris
Posted on: 01 May 2022 20:52
I TOTALLY need this functionality. I'm so used to being able to manipulate the Telerik objects via code, but suddenly it seems that this Blazor Calendar has less functionality? Or at least fewer hooks? Is there no way to set a start date or end date when NOT using the bind method? Or if I do use the bind methods, is there a way to access the RangeStartChanged handler to do what I need to do at that point?