Layout
The Telerik UI for ASP.NET MVC Wizard supports configuration of its layout.
By default the Telerik UI for ASP.NET MVC Wizard is rendered with a Stepper in a horizontal orientation above the content of the Wizard. The layout could be configured via the ContentPosition configuration option. The available options allow you to display a vertical Stepper on the left or right side of the Wizard step content.
The following example demonstrates how to initialize a Wizard with a vertical Stepper and content rendered on the right side of the Stepper.
@(Html.Kendo().Wizard()
.Name("wizard")
.ContentPosition(WizardContentPosition.Right)
.Steps(s=> {
s.Add<UserViewModel>()
.Title("User Details")
.Form(form =>
{
form.FormData(Model);
form.Items(itm =>
{
itm.Add().Field(f => f.UserName);
itm.Add().Field(f => f.Email);
itm.Add().Field(f => f.Password);
});
});
s.Add<UserViewModel>()
.Title("Personal Details")
.Form(form =>
{
form.FormData(Model);
form.Items(itm =>
{
itm.Add().Field(f => f.FirstName);
itm.Add().Field(f => f.LastName);
itm.Add().Field(f => f.DateOfBirth);
});
});
})
)