This is a migrated thread and some comments may be shown as answers.

Syncing initial calendar view to min date

9 Answers 383 Views
DatePicker
This is a migrated thread and some comments may be shown as answers.
Neil N
Top achievements
Rank 1
Iron
Veteran
Iron
Neil N asked on 07 Apr 2021, 04:27 PM
Is it possible to sync the initial calendar view to min date?  I've set min to DateTime.Now.AddDays(30) but when I click the calendar it defaults to showing the month of April, with April 7th highlighted.  This confuses the user as they try clicking various dates in April.

9 Answers, 1 is accepted

Sort by
0
Marin Bratanov
Telerik team
answered on 09 Apr 2021, 08:18 AM

Hello Neil,

To set the current date (month, year, decade) the user starts in the calendar, set its Date parameter to the desired date. You can find more details and example in the documentation about calendar nagivation: https://docs.telerik.com/blazor-ui/components/calendar/navigation

Here's also an example that starts the calendar in the min date because the Date and Min parameters have the same value:

<TelerikCalendar @bind-Date="@startDate" Min="@minDate" Max="@maxDate"></TelerikCalendar>
@code {
    DateTime startDate = DateTime.Now.AddDays(-30);
    DateTime minDate = DateTime.Now.AddDays(-30);
    DateTime maxDate = DateTime.Now.AddDays(230);
}


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.

0
Neil N
Top achievements
Rank 1
Iron
Veteran
Iron
answered on 12 Apr 2021, 10:22 PM
I am using the DatePicker component, not the Calendar, as I need to accept null dates.
0
Marin Bratanov
Telerik team
answered on 13 Apr 2021, 06:55 AM

Hi Neil,

How would you expect a picker to expose this, considering a few factors:

  • unlike the calendar, its calendar is not always visible, so it will re-render from scratch every time it opens
  • unlike the calendar, the date it shows is bound to it like an input - through @bind-Value - and this is its main driving parameter, it is, first and foremost, an input - in the calendar the date selection is a separate feature which is not the primary display of the component
  • there is a default min date that is about a century ago, and for most people and use cases that's too far back in time to be useful

The popup calendar in Windows has the same behavior - whatever you scroll to, when you close and open it again it starts in the month with Today's date.

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.

0
Neil N
Top achievements
Rank 1
Iron
Veteran
Iron
answered on 13 Apr 2021, 11:59 AM

Hi Marin,

The current behaviour is:

  • if date is set, show month of set date
  • else show month of current date (today)

Desired behaviour:

  • if date is set, show month of set date
  • else if min date's month is greater than current date month then show month of min date
  • else show month of current date

The Windows popup calendar is not for date input, nor is there a way to set a min date for it. I'm trying to create a UX which isn't user hostile. If the min date is six months in the future (for example), it's not very user-friendly to scroll through six months if they want to set a date.

 

0
Marin Bratanov
Telerik team
answered on 13 Apr 2021, 02:03 PM

Hello Neil,

If the min date is not near the current date, then you can consider setting the Value to the min date and checking if that changed in the business logic to indicate whether the user made a choice or not.

The Value is the main driver of this component and it determines what the user sees. How else would you like to see this configured? What about other cases where the min date is not larger than the current date? What about people who'd rather start near today's date? How should the component accommodate those scenarios?

Regards,
Marin Bratanov
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/.

0
Neil N
Top achievements
Rank 1
Iron
Veteran
Iron
answered on 13 Apr 2021, 02:26 PM

70% of users will not want to set a date - it will only confuse them if they see a date set for them.

What about other cases where the min date is not larger than the current date? Answered above:

* else if min date's month is greater than current date month then show month of min date
* else show month of current date

What about people who'd rather start near today's date?

Can you please explain how defaulting to showing unpickable dates in a datepicker is a good UX?

 

0
Neil N
Top achievements
Rank 1
Iron
Veteran
Iron
answered on 13 Apr 2021, 02:40 PM

I had a look at ASP.NET AJAX datepicker and it looks like it has this functionality:

RadDatePicker1.FocusedDate = DateTime.Today.AddDays(30);

0
Accepted
Marin Bratanov
Telerik team
answered on 13 Apr 2021, 06:41 PM

Hello Neil,

I made the following enhancement request on your behalf where you can Follow the status of this idea: https://feedback.telerik.com/blazor/1515267-set-focused-initial-date-that-is-different-than-the-value. If it gets sufficient traction with the community, its implementation will be prioritized by management.

Regards,
Marin Bratanov
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/.

0
Neil N
Top achievements
Rank 1
Iron
Veteran
Iron
answered on 13 Apr 2021, 06:44 PM
Thank you.
Tags
DatePicker
Asked by
Neil N
Top achievements
Rank 1
Iron
Veteran
Iron
Answers by
Marin Bratanov
Telerik team
Neil N
Top achievements
Rank 1
Iron
Veteran
Iron
Share this question
or