RadzenSteps "next" and "previous" buttons don't mimic disabled states #1950

New Issue

claunia · 2026-01-29T18:16:00Z

claunia commented

2026-01-29 18:16:00 +00:00

Originally created by @WillemW-01 on GitHub (Jan 15, 2026).

Describe the bug
When using the RadzenSteps component, then the "next" and "previous" buttons (from the navigation buttons at the bottom), will not mimic the disabled state of the steps at the top.

For example, if you have 3 steps, and you disable step 2:

if you are on step 1, the step 2 navigation circle at the top is disabled, but the next button is not
if you are on step 3, the step 2 navigation circle at the top is disabled, but the previous button is not

To Reproduce
Steps to reproduce the behavior:

Go to this playground which has a minimal steps component with 3 steps, and step 2 disabled: https://blazor.radzen.com/playground/f2d4a698-9174-402b-9e11-2cb2e56ae325
Optionally ensure the theme is material and not material3 (the disabled effect is more pronounced)
Ensure you run the playground
Notice that on step 1, the next button highlights upon hover, whereas the step 2 button at the top is disabled
Click on the step 3 button at the top
Notice that now the previous button also highlights upon hover, whereas the step 2 button at the top is disabled

Expected behavior
When a step is disabled, the steps around is should disable the respective "next" and "previous" buttons.

For example:

if on step 1 in the example given, the "next" button should be disabled
if on step 3 in the example given, the "previous" button should be disabled

Screenshots

Desktop (please complete the following information):

OS: Windows
Browser Edge
Version 143.0.3650.96

Additional context
Right now I can get around this problem with custom javascript:

function applyNextButtonDisabledState(shouldDisable) {
    const nextButton = document.querySelector("a.rz-steps-next");
    nextButton.classList.toggle("rz-state-disabled", shouldDisable);
}

But I believe this should be part of the component itself and is therefore a bug.

Originally created by @WillemW-01 on GitHub (Jan 15, 2026). **Describe the bug** When using the `RadzenSteps` component, then the "next" and "previous" buttons (from the navigation buttons at the bottom), will not mimic the disabled state of the steps at the top. For example, if you have 3 steps, and you disable step 2: - if you are on step 1, the step 2 navigation circle at the top is disabled, but the next button is not - if you are on step 3, the step 2 navigation circle at the top is disabled, but the previous button is not **To Reproduce** Steps to reproduce the behavior: 1. Go to this playground which has a minimal steps component with 3 steps, and step 2 disabled: https://blazor.radzen.com/playground/f2d4a698-9174-402b-9e11-2cb2e56ae325 3. Optionally ensure the theme is `material` and not `material3` (the disabled effect is more pronounced) 4. Ensure you run the playground 5. Notice that on step 1, the next button highlights upon hover, whereas the step 2 button at the top is disabled 6. Click on the step 3 button at the top 7. Notice that now the previous button also highlights upon hover, whereas the step 2 button at the top is disabled **Expected behavior** When a step is disabled, the steps around is should disable the respective "next" and "previous" buttons. For example: - if on step 1 in the example given, the "next" button should be disabled - if on step 3 in the example given, the "previous" button should be disabled **Screenshots** <img width="902" height="103" alt="Image" src="https://github.com/user-attachments/assets/3ef3fbf9-25ce-4add-afbf-ca98d881ec16" /> **Desktop (please complete the following information):** - OS: Windows - Browser Edge - Version 143.0.3650.96 **Additional context** Right now I can get around this problem with custom javascript: ``` function applyNextButtonDisabledState(shouldDisable) { const nextButton = document.querySelector("a.rz-steps-next"); nextButton.classList.toggle("rz-state-disabled", shouldDisable); } ``` But I believe this should be part of the component itself and is therefore a bug.

Sign in to join this conversation.

Branches Tags

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: starred/radzen-blazor#1950