Stepper Form with Data Passing Across Pages

This is an explanation of a stepper form with multiple pages, where data entered on earlier pages is passed and displayed on the final review page. Below are the details for each page and the flow of data:

Step 1: Personal Details

On the first page, the user provides their personal information. The fields collected on this page are:

First Name (e.g., “Tom”)

Last Name (e.g., “Dsouza”)

Select Country (a dropdown to choose the country)

Select Language (a dropdown to choose the preferred language)

Select Role (a dropdown to choose the user’s role)

Once the user completes this section, the data will be saved temporarily, making it accessible for use on later pages.

Step 2: Profile Picture Upload

The second page allows the user to upload a profile picture. This page does not pass data to the review form directly but does save the uploaded picture. This image will be associated with the user’s profile but won’t be displayed on the review page unless needed.

Step 3: Workspace Details

On the third page, the user enters their workspace information. The fields collected are:

Company Name (e.g., “Google”)

Select Team Size (a dropdown to select the number of team members)

This data is also stored and will be shown on the review page, along with the personal details.

Step 4: Review Form

The final page is the Review Form, where the user can review all the information they have entered on the previous pages. The following data will be displayed for review:

Personal Details:

First Name: Tom

Last Name: Dsouza

Country: [Country selected]

Language: [Language selected]

Role: [Role selected]

Workspace Details:

Company Name: Google

Team Size: [Team size selected]

Review Form

The final page is the Review Form, where the user can review all the information they have entered on the previous pages. The following data will be displayed for review:
First Name: Tom

Last Name: Dsouza

Country: [Country selected]

Language: [Language selected]

Role: [Role selected]

Workspace Details:

Company Name: Google

Team Size: [Team size selected]