Tutorial - Dynamic Selection List

In this tutorial we will show you how to setup a selection list with options that change dynamically based on option selected in another selection list . We will use the demo database for demonstration. The "Cars", "Trademarks" and "Models" tables will be used in the example.

We'll generate add or edit page for the "Cars" table, in the page two selection lists will be generated for the "Trademark" and "Model" fields using the "SELECT" Edit Tag. When the user choose a trademark in the trademark selection list, the options in the model selection list will be changed accordingly. Only models belonged to the selected trademark will be shown. We refer to the "Trademark" field as the parent field and the "Model" field as the child field.

Fields in Table "Trademarks"

Fields in Table "Models"

Fields in Table "Cars"

Note: Each child field's lookup table must have a Filter field storing key field value of the parent field. In this example, the "Models" table has an integer field named "Trademark" storing the trademark ID of the model.

Steps to Setup selection list with dynamic options

1. Loading ASP Maker

Open ASP maker and connect to the demo.mdb database.

2. Setting up the selection lists

Click "Cars" table on the Database pane.

Select field "Trademark" and click on [SELECT] on the [Edit Tag Panel]. Check [Use Lookup Table] checkbox on the [Edit Tag] panel and enter the following setting.

To set up child fields, click [Child lookup fields...] and enter the following settings:

[Link field] is the field (in lookup table) whose value is actually saved. In this example, the field value of Models.ID (NOT Models.Model) will be saved to the field Cars.Model.

[Filter field] is the field (in lookup table) by which the lookup table records are filtered. Only records with a Filter field value matching the selected value of the parent selection list will be shown. In this example, only models with Trademark field value matching the selected Trademark ID in the parent selection list are shown.

Click [OK] to confirm.

If you now select the Model field, you'll see:

Note on [Use Ajax]: ASPMaker supports Dynamic Selection Lists by Ajax. You can optionally check [Use Ajax] for both selection lists. If [Use Ajax] is enabled, the selection list will be updated by Ajax. The advantage of using Ajax is that if you have large lookup tables, the time to load the page will be much shortened because there will be less options in the selection lists initially. The disadvantage is that Ajax requires newer browsers.

3. ASP Script Generation

Click the [Generate] button and ASP maker will generate the required ASP scripts automatically.

4. Running the ASP Application

Click on the link to the "Cars" table and go to the Edit page. The options in the model selection list will be changed automatically when the selected option in trademark selection list is changed: