Code blocks within Wizard steps causes the stepper not to load

1 Answer 21 Views
Wizard
eleven
Top achievements
Rank 1
eleven asked on 22 Jul 2022, 07:59 PM
I'm running into a new issue with the UI for ASP.NET Core's Wizard in that if I add a code block, e.g., a @if statement or a @Localizer within a <wizard-step-content> tags, it will cause the stepper along the top not display. What are my options - I'll need the @if statements work in order to have certain information appear depending on what issue the user is submitting.

1 Answer, 1 is accepted

Sort by
1
Accepted
Stoyan
Telerik team
answered on 27 Jul 2022, 01:40 PM

Hi Jenna,

The issue arises because the <wizard-step-content> property uses the Html passed to it to encode the content of the Wizard's step. This means that Razor syntax is incompatible with the <wizard-step-content> property.

To avoid this issue you can either use the conditional statement outside of the property:

 @if(true){
                    <wizard-step-content>
                        <div class="wizardContainer">
                            //custom content
                        </div>
                    </wizard-step-content>
        }else{
                    <wizard-step-content>
                          //another content
                    </wizard-step-content>
        }

Alternatively, you can await the initialization of the Wizard and then modify the content with jQuery:

$(document).ready(function(){
       $(".wizardContainer").append("custom Html string")
})

I hope this information is helpful.

Regards,
Stoyan
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

eleven
Top achievements
Rank 1
commented on 03 Aug 2022, 03:22 PM

Very helpful, @stoyan - thank you!
Tags
Wizard
Asked by
eleven
Top achievements
Rank 1
Answers by
Stoyan
Telerik team
Share this question
or