Blazor Dropdown List Example - Disabled Items

This example demonstrates the DropDownList component’s disabled-items feature, visually indicating options that are present but not selectable. Disabled entries remain visible for context while being excluded from selection and value binding, supporting scenarios such as deprecation, temporary unavailability, or conditional availability without removing items from the list.

Disabled items behavior:

• Disabled entries appear visually distinct (typically greyed out) in the popup to signal non-interactivity.
• Disabled options cannot be selected or used to update the component value or the bound model.
• Configure disabled state using the DropDownListFieldSettings.Disabled property.

Implementation notes:

• Expose a boolean field on your data model to mark disabled items and map it to FieldSettings.Disabled in the DropDownList configuration.
• Disabled items remain in filtered and paged results to preserve list context; selection logic ignores these items to avoid accidental binding.
• Provide clear styling and sufficient contrast for disabled states and include ARIA attributes where appropriate to improve screen-reader semantics.

When working with remote data sources, determine disabled flags server-side and include them in the returned payload so FieldSettings.Disabled can reference the field directly. Ensure keyboard and focus behavior skip disabled entries and that the component announces non-interactive items to assistive technologies; consider using aria-disabled or aria-describedby to convey the reason when appropriate. Validate that disabled items are preserved during filtering and paging so users understand why certain choices are unavailable. Also test disabled-state behavior in forms and model-binding workflows to confirm that form validation and submission ignore disabled entries and that value-binding remains deterministic across browsers and devices.

Refer to the linked API reference for examples and recommended property mappings; anchors open in a new tab and include aria-label attributes for accessibility.