New to Kendo UI for jQuery? Download free 30-day trial

Steps

The steps configuration allows you to configure each Step of the Stepper.

You can set the label and the icon of an indicator element and define whether they would be enabled and available for selection or not. You can further set teh step that would be selected when the widget is rendered. The configuration also allows you to also define whether a step would be in error state.

The following example demonstrates how the set the configuration for the Steps of the Stepper through the steps configuration.

    <nav id="stepper"></nav>

    <script>
        $(document).ready(function () {
            $("#stepper").kendoStepper({
                steps: [{
                    label: "First step",
                    icon:"home",
                },{
                    label: "Second step",
                    icon: "paperclip",
                    error: true
                },{
                    label: "Preview",
                    icon: "eye",
                    selected: true
                },{
                    label: "Last step",
                    icon: "save",
                    enabled: false
                }]
            });
        });
    </script>

See Also

In this article