Steps

Use Radzen Blazor Steps component to guide users through a process or sequence of actions. The component consists of a series of numbered steps that represent the various stages of the process.

Example
Edit Source

1. Select a Customer to continue

Customer ID Filter Contains Equals Not equals Contains Starts with Ends with Does not contain Is null Is empty Is not null Is not empty And And Or Equals Equals Not equals Contains Starts with Ends with Does not contain Is null Is empty Is not null Is not empty	Company Name Filter Contains Equals Not equals Contains Starts with Ends with Does not contain Is null Is empty Is not null Is not empty And And Or Equals Equals Not equals Contains Starts with Ends with Does not contain Is null Is empty Is not null Is not empty	Contact Name Filter Contains Equals Not equals Contains Starts with Ends with Does not contain Is null Is empty Is not null Is not empty And And Or Equals Equals Not equals Contains Starts with Ends with Does not contain Is null Is empty Is not null Is not empty	Contact Title Filter Contains Equals Not equals Contains Starts with Ends with Does not contain Is null Is empty Is not null Is not empty And And Or Equals Equals Not equals Contains Starts with Ends with Does not contain Is null Is empty Is not null Is not empty	Address Filter Contains Equals Not equals Contains Starts with Ends with Does not contain Is null Is empty Is not null Is not empty And And Or Equals Equals Not equals Contains Starts with Ends with Does not contain Is null Is empty Is not null Is not empty	City Filter Contains Equals Not equals Contains Starts with Ends with Does not contain Is null Is empty Is not null Is not empty And And Or Equals Equals Not equals Contains Starts with Ends with Does not contain Is null Is empty Is not null Is not empty	Region Filter Contains Equals Not equals Contains Starts with Ends with Does not contain Is null Is empty Is not null Is not empty And And Or Equals Equals Not equals Contains Starts with Ends with Does not contain Is null Is empty Is not null Is not empty	Postal Code Filter Contains Equals Not equals Contains Starts with Ends with Does not contain Is null Is empty Is not null Is not empty And And Or Equals Equals Not equals Contains Starts with Ends with Does not contain Is null Is empty Is not null Is not empty	Country Filter Contains Equals Not equals Contains Starts with Ends with Does not contain Is null Is empty Is not null Is not empty And And Or Equals Equals Not equals Contains Starts with Ends with Does not contain Is null Is empty Is not null Is not empty	Phone Filter Contains Equals Not equals Contains Starts with Ends with Does not contain Is null Is empty Is not null Is not empty And And Or Equals Equals Not equals Contains Starts with Ends with Does not contain Is null Is empty Is not null Is not empty	Fax Filter Contains Equals Not equals Contains Starts with Ends with Does not contain Is null Is empty Is not null Is not empty And And Or Equals Equals Not equals Contains Starts with Ends with Does not contain Is null Is empty Is not null Is not empty
ALFKI	Alfreds Futterkiste	Maria Anders	Sales Representative	Obere Str. 57	Berlin		12209	Germany	030-0074321	030-0076545
ANATR	Ana Trujillo Emparedados y helados	Ana Trujillo	Owner	Avda. de la Constitución 2222	México D.F.		05021	Mexico	(5) 555-4729	(5) 555-3745
ANTON	Antonio Moreno Taquería	Antonio Moreno	Owner	Mataderos 2312	México D.F.		05023	Mexico	(5) 555-3932
AROUT	Around the Horn	Thomas Hardy	Sales Representative	120 Hanover Sq.	London		WA1 1DP	UK	(171) 555-7788	(171) 555-6750
BERGS	Berglunds snabbköp	Christina Berglund	Order Administrator	Berguvsvägen 8	Luleå		S-958 22	Sweden	0921-12 34 65	0921-12 34 67
BLAUS	Blauer See Delikatessen	Hanna Moos	Sales Representative	Forsterstr. 57	Mannheim		68306	Germany	0621-08460	0621-08924
BLONP	Blondesddsl père et fils	Frédérique Citeaux	Marketing Manager	24, place Kléber	Strasbourg		67000	France	88.60.15.31	88.60.15.32
BOLID	Bólido Comidas preparadas	Martín Sommer	Owner	C/ Araquil, 67	Madrid		28023	Spain	(91) 555 22 82	(91) 555 91 99
BONAP	Bon app'	Laurence Lebihan	Owner	12, rue des Bouchers	Marseille		13008	France	91.24.45.40	91.24.45.41
BOTTM	Bottom-Dollar Markets	Elizabeth Lincoln	Accounting Manager	23 Tsawassen Blvd.	Tsawassen	BC	T2F 8M4	Canada	(604) 555-4729	(604) 555-3745

Previous Next

Console log

CanChange event link

The CanChange event allows you to conditionally prevent the step change. Use it to ensure your users have entered all the required information before moving to the next step.

Example
Edit Source

Previous Next

All the tools in one place

Code Less. Deliver More.

With Radzen Subscription you get the full toolkit. Get started now and save hours on every project.

task_alt

Complete Blazor development environment.

task_alt

Open technology stack. No vendor lock-in.

task_alt

Ready-to-use UI blocks and app templates.

task_alt

Advanced theming.

task_alt

Dedicated support backed by proven expertise.

task_alt

No hidden runtime costs.

Start Free See All Benefits

CRUD Operations and Data Management

Seamless Integration

Digital Transformation and Modernization

Design Systems and Consistency

From Prototyping to Production

Time to Market Reduced

Empower the Next Generation

Steps

1. Select a Customer to continue

CanChange event link

Code Less. Deliver More.

On this page

Demos Configuration