Completed
Last Updated: 15 Mar 2024 12:34 by ADMIN
Release 2024 Q2 (May)
Created by: Mauro
Comments: 0
Category: Wizard
Type: Feature Request
7
Hello.
I wanted to know how I can modify the WizardStepper template?

Basically I want to customize the WizardStepper in a similar way to when it is customized in the Stepper component (https://docs.telerik.com/blazor-ui/components/stepper/step-template).

Since the WizardStepper is actually a Stepper, I suppose this is possible. The point is that I have not managed to do it. I'd tried WizardStepperSettings but only two properties can be configured from here (StepType and Linear).  

Thanks.

Mauro
Declined
Last Updated: 11 Jan 2024 15:44 by ADMIN
Created by: Alain
Comments: 1
Category: Wizard
Type: Feature Request
0

Hi,

I have a page (a billing page) that has a wizard on it, the wizard contains multiple steps, and each step contains a custom component. Each component has a validation mechanism. When I open an invoice, I want to provide the user with a message to let them know if the invoice can be processed. To do this, I need to invoke the validation mechanism of all the steps, which is not possible without opening them all to have an existing instance.

Regard

Al

 

Unplanned
Last Updated: 19 Dec 2022 14:54 by Nicolas
Created by: Nicolas
Comments: 0
Category: Wizard
Type: Feature Request
1
When I move from step A to step B the content of step A is removed from the DOM which means that the next time I go back to step A the user has to input everything anew. 
Unplanned
Last Updated: 10 Nov 2022 09:01 by ADMIN
Created by: Andre
Comments: 3
Category: Wizard
Type: Feature Request
10

 The disable option is still showing the step and it is not good for me. I have 35 types of transactions and all of them have generic and specific step.

---

ADMIN EDIT

Here is a potential workaround - basic conditional markup can add or remove steps. The key thing is that they will be added to the end of the wizard if they had not been rendered. To handle this, dispose and re-initialize the component, so the step will be rendered at the correct position.

If you have complex steps, you can work around this by creating a collection of descriptor models for the list of steps and create the steps based on that collection, where you can keep the VIsible flag, in a fashion similar to this example for the TabStrip.

<TelerikButton OnClick="@ToggleStep">Toggle attachments step visibility</TelerikButton>

@if (WizardVisible)
{
    <TelerikWizard @bind-Value="@CurrStepIndex" >
        <WizardSteps>
            <WizardStep Label="Personal Details" Icon="user">
                <Content>
                    content here
                </Content>
            </WizardStep>

            @if (AttachmentsStepVisible)
            {
                <WizardStep Label="Attachments" Icon="paperclip">
                    <Content>
                        conditional content here
                    </Content>
                </WizardStep>
            }

            <WizardStep Label="Confirmation" Icon="check">
                <Content>
                    other content here
                </Content>
            </WizardStep>
        </WizardSteps>
    </TelerikWizard>
}


@code {
    bool AttachmentsStepVisible { get; set; }
    bool WizardVisible { get; set; } = true;

    int CurrStepIndex { get; set; }

    async void ToggleStep()
    {
        //dispose the Wizard
        WizardVisible = false;

        // defence against hiding the step when it is the last step, which would cause an exception
        if (AttachmentsStepVisible && CurrStepIndex == 2)
        {
            CurrStepIndex = 1;
        }

        //the actual visibility toggle
        AttachmentsStepVisible = !AttachmentsStepVisible;

        //allow some time for the disposal and toggling the step visibility prior to re-initialization
        await Task.Delay(10);

        //re-initialize the Wizard
        WizardVisible = true;

        StateHasChanged();
    }
}

---

Unplanned
Last Updated: 16 Aug 2022 06:10 by ADMIN
Created by: Eric
Comments: 1
Category: Wizard
Type: Feature Request
1

Hi

We have to muchs steps in our wizards

So it would be nice to make the stepper scrollable

Example:

10 steps

visual are 1..7 , if i'm on step 4 , step 1 dissappears and 8 will be visible etc....

Also small < > added to the stepper could be uses to moves quickly throug the steps

This would be a nice enhancement