Create a Series of Wizard Pages to Add a Record

Updated March 30, 2010
Iron Speed Designer V7.0 and later

Creating a wizard – a series of web pages that create or update a single database record – is easy to do in Iron Speed Designer.

Let’s say you have an Add Customer function that gathers information about a new customer using two pages:

By default, Iron Speed Designer creates applications where the transaction boundary is page-based – a normal .NET practice.  So any information gathered is committed to the database for each page.  In order to create a wizard where one transaction spans data gathered on multiple web pages, you will need to write custom code.  This code customization saves information gathered in each page in the session instead of the database.  Then, the code customization saves the combined information to the database on the final page of the wizard.  This is fairly easy to accomplish.

The following example demonstrates this Iron Speed Designer feature by splitting an ‘Add Customer’ procedure into a two-step process: first, we gather the customer ID, company name, contact name and contact title.  Second, we add customer contact information such as address, phone, FAX, etc.  The example is built using the Customers table in the Northwind database.

Creating the first page in the wizard

Step 1:  Create an Add Record page using the Application Wizard in Iron Speed Designer.  For this example, use the Customers table in the Northwind database.  This example assumes an Add Record page was not already created by default.  If you already have Add Record page in your application, you can either delete or modify that Add Record page in similar fashion.

Step 2:  Delete the Save and Cancel buttons since we won’t need to save any data to the database in the first step of our wizard.

Step 3:  In the Layout Editor, select the Record panel and remove all of the fields except CustomerID, CompanyName, ConctactName, and ContactTitle.

Step 4:  In the Layout Editor, drag a Button control from the Toolbox onto the Add Record panel.

Step 5:  For the newly added “Next” button control, set these properties in the Property Sheet:

Group

Property

Setting

[Application Generation]

Button action

Redirect / Go to a specific URL

Specify the path of the second page as the URL which will be created in the second part of this code example.  You can come back and set this URL after the page is created.

Appearance

Text

Next

Behavior

Button-CausesValidation

True

This ensures the data on the first page will be validated before the second page is displayed.

Step 6:  Override the Button_Click() method in the AddCustomer class in the first page, located in:

...\<App Folder>\Customers\AddCustomers.aspx.cs or .vb

Handle the command for the button as shown below.  In this function, the data values are stored in session variables.

C#:

public void Button_Click(object sender, EventArgs args)

{

     //store  data in session variables

     System.Web.HttpContext.Current.Session["Customer"] = this.CustomerID.Text;

     System.Web.HttpContext.Current.Session["CompanyName"] = this.CompanyName.Text;

     System.Web.HttpContext.Current.Session["ContactName"] = this.ContactName.Text;

     System.Web.HttpContext.Current.Session["ContactTitle"] = this.ContactTitle.Text;

 

     Button_Click_Base(sender, args);

}

Visual Basic .NET:

Public Sub Button_Click(ByVal sender As Object, ByVal args As EventArgs)

     System.Web.HttpContext.Current.Session("Customer") = Me.CustomerID.Text

     System.Web.HttpContext.Current.Session("CompanyName") = Me.CompanyName.Text

     System.Web.HttpContext.Current.Session("ContactName") = Me.ContactName.Text

     System.Web.HttpContext.Current.Session("ContactTitle") = Me.ContactTitle.Text

     Button_Click_Base(sender, args)

End Sub

Creating the final page in the wizard

If you have more than two pages in your wizard, all pages except the last one will be similar to the first page described above.  They all contain a Next button that is handled in the Page class to save their values in session variables.  The final wizard page is different from the other pages because it must collect data values saved in the session variables in the previous pages and save this data to the database.  In our example, a Customers record is added to the database.

Step 1:  Create an Add Record page using the Application Wizard in Iron Speed Designer.  For this example, use the Customers table in the Northwind database and will call this page AddCustomers2.aspx.

Step 2:  In the Layout Editor, select Record panel and remove the CustomerID, CompanyName, ConctactName, and ContactTitle fields.

Step 3:  Override the GetUIData() method in the CustomerRecordControl class, located in:

...\<App Folder>\App_Code\Customers\AddCustomers2.Controls.cs or .vb

In this method we collect data from the second wizard page and add the data values from first page that were saved in session variables.

C#:

public override void  GetUIData()

{

     this.DataSource.CustomerID  =System.Web.HttpContext.Current.Session["Customer"].ToString();

     this.DataSource.CompanyName = System.Web.HttpContext.Current.Session["CompanyName"].ToString();

     this.DataSource.ContactName = System.Web.HttpContext.Current.Session["ContactName"].ToString();

     this.DataSource.ContactName = System.Web.HttpContext.Current.Session["ContactTitle"].ToString();

 

base.GetUIData();

}

Visual Basic .NET:

Public Overrides Sub GetUIData()

     Me.DataSource.CustomerID = System.Web.HttpContext.Current.Session("Customer").ToString()

     Me.DataSource.CompanyName = System.Web.HttpContext.Current.Session("CompanyName").ToString()

     Me.DataSource.CompanyName = System.Web.HttpContext.Current.Session("ContactName").ToString()

     Me.DataSource.CompanyName = System.Web.HttpContext.Current.Session("ContactTitle").ToString()

 

     MyBase.GetUIData()

End Sub

By default, the Save button in the last wizard page will point to the previous page.  In this case, you might want to modify the properties of the Save button to point to a Table Report page instead.

Step 4:  Finally, build and run the application.