-
Notifications
You must be signed in to change notification settings - Fork 4.6k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Calendar view="month" and selectionMode="range" not working properly #11153
Comments
Also bumped into this problem today. |
I'm also going through the same situation. |
This is a pretty critical UX issue, can we get an idea on when this bug will be resolved? Appreciate the amazing work!!! |
Issue also impacts year view with range selection. |
We also encountered the same issue after having upgraded to Angular 13 and PrimeNG 13. Seems that there is the same problem with years range selection with the corresponding PR: #11426. |
Here is the fix pr for the month range selection problem: #11655 |
I think is related, but if you choose year and month navigation, the dates outside the min and max dates are available to select. They should be disabled. |
Fixed #11153: month range selection in calendar
I'm submitting a ... (check one with "x")
Plunkr Case (Bug Reports)
https://stackblitz.com/edit/primeng-calendar-demo-nrnhmx?file=src%2Fapp%2Fapp.component.ts
Current behavior
Currently if you set the calendar component with view="month" and selectionMode="range" the selected range is not been highlighted.
Also, if you set up the property maxDate, the corresponding dates (in this case months) are not being disabled.
Expected behavior
The selected month range should be highlighted.
Months after maxDate should be disabled.
Minimal reproduction of the problem with instructions
Using the example provided, select a range of months.
Notice that even with maxDate set to February, months after that are not being disabled
What is the motivation / use case for changing the behavior?
The user needs to see the range he/she selected
I need to be able to show the user that future dates (months) are not avaible to select
Please tell us about your environment:
Operating system: Windows 10 Enterprise
IDE: VSCode
Package manager: npm, node
Angular version:
13.2.1
PrimeNG version:
13.1.0
Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]
Chrome 89.0.4389.128
Language: [all | TypeScript X.X | ES6/7 | ES5]
TypeScript 4.1.2
Node (for AoT issues): node --version =
v14.15.1
The text was updated successfully, but these errors were encountered: