Blazor DatePicker Example - Disabled Dates
This sample demonstrates the Disabled Dates capability of the DatePicker component by preventing selection of all weekend days (Saturday and Sunday) within a month. Disabled cells are presented visually and programmatically so users cannot choose unavailable dates.
The example implements this behavior using the OnRenderDayCell event. This event is raised for each day-cell element as it is created, allowing per-cell customization such as adding CSS classes, setting attributes, or marking cells as disabled to restrict selection.
In this sample, weekend dates are detected inside the event handler and decorated with a disabled CSS class and relevant attributes to prevent selection. The UI updates reflect the disabled state so users receive clear visual feedback that those dates are not selectable.
Implementation notes: when marking dates disabled, ensure equivalent accessibility support by exposing state through semantic attributes (for example, aria-disabled) and preserving predictable keyboard focus behavior. Keep cell modifications minimal and test rendering across cultures and localized calendars so weekend detection matches the intended locale.
The pattern shown here is suitable for enforcing business rules that exclude specific dates (holidays, maintenance windows, or recurring nonworkdays) while preserving the DatePicker’s native interaction model and accessibility characteristics.