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.

Table "cars" having 2 fields named "Trademark" and "Model"

Table "trademarks" - Lookup Table for the parent field "Trademark" in "cars" table

Table "models" - Lookup Table for the child field "Model" in "cars" table

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 PHPMaker

Open PHPMaker and connect to the demo 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]: PHPMaker 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. PHP Script Generation

Click the [Generate] button and PHPMaker will generate the required PHP scripts automatically.

4. Running the PHP 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:

 

 ©2002-2012 e.World Technology Ltd. All rights reserved.