Create a Series of Wizard Pages to Add a Record

"Creating a wizard - a series of web pages that create or update a single database record - is easy to do in Iron Speed Designer."
- Anh Trinh, Software Engineer, Iron Speed, Inc.

February 1, 2007
Iron Speed Designer V4.1

Introduction
Let’s say you have an Add Customer function that gathers information about a new customer using two pages:
  • Add Customer page, for collecting and updating basic customer information.

  • Add Credit Card information page, for collecting and updating the customer’s credit card information.

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
In this code example, we assume Add Record page is not created by default. If you already have Add Record page in your application, you can either delete or modify Add Record page in similar fashion.

Step 1: Create an Add Record page using the New Page dialog or Application Wizard in Iron Speed Designer. For this example, use the Customers table in the Northwind database.

Step 2: Click "Configure..." in the Record panel to display the Record Panel Wizard. In the Fields tab, remove all of the fields except CustomerID, CompanyName, ConctactName, and ContactTitle. Then click "Finish".

Step 3: Drag and drop a button from the tool box within the Add Record panel. Set the button text to "Next".

Step 4: Double click the "Next" button to display the Properties dialog box for the button. On the Bindings tab, set these properties:

Property Setting
Button Command Redirect
Action after command

 

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.

On the Attributes tab, set these properties:

Property Setting
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 AddCustomerPage class in the first page, located in:

.NET Framework 1.1 and 2.0:

...\<App Folder>\Customers\AddCustomersPage.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 New Page dialog or Application Wizard in Iron Speed Designer. For this example, use the Customers table in the Northwind database and will call this page AddCustomersPage2.aspx.

Step 2: Click "Configure..." in the Record panel to display the Record Panel Wizard. In the Fields tab, remove the CustomerID, CompanyName, ConctactName, and ContactTitle fields. Then click "Finish".

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

.NET Framework 1.1:

...\<App Folder>\Orders\AddOrdersPage2.Controls.cs or .vb

NET Framework 2.0:

...\<App Folder>\App_Code\Customers\AddCustomersPage2.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 Show Table page instead.

Step 4: Finally, build and run the application.

About the Author
Anh Trinh
Software Engineer, Iron Speed, Inc.

Anh is a software engineer at Iron Speed, Inc. He enjoys developing applications with Iron Speed Designer and Microsoft .NET technology.



  Privacy Statement