Revision as of 03:31, 19 November 2019

Step

Demonstration:
Java API: Step
JavaScript API: Step

Available for ZK:

[ since 9.0.0 ]

Employment/Purpose

A step is used for displaying user navigation, it should be placed inside a Stepbar and shouldn't be used without a Stepbar.

Example

<zk>
    <stepbar linear="false" activeIndex="2" width="600px">
        <step title="First Step" iconSclass="z-icon-home"/>
        <step title="Second Step" complete="true" />
        <step title="Third Step" error="true" />
    </stepbar>
</zk>

Properties

Complete

Whether this step is completed. (Default: false)

The default visual style:

Error

Whether this step is in error. (Default: false)

The default visual style:

The priority of error is higher than complete. If both properties are set, the result will be an error state visually.

IconSclass

Set the icon sclass to apply custom icons.

By applying this property, the complete and error icons are changed accordingly.

<stepbar>
    <step title="Default Error" error="true"/>
    <step title="Custom Error" error="true" iconSclass="z-icon-bug"/>
</stepbar>

Title

Set the title (label) of each step. (Default: empty)

Supported Events

Name	Event Type
none	none

Inherited Supported Events: XulElement

Supported Children

* None

Use Cases

Version	Description	Example Location

Version History

Last Update : 2019/11/19

Version	Date	Content
9.0.0	November, 2019	ZK-4375: Provide a stepbar component