User Guide

Bind components to display product information from an external source 31
2.
Drag four instances of the Label component onto the Stage. Name and position the instances
as follows:
For the first instance, enter ccName_lbl for the instance name and set the X and Y
coordinates to 5, 5. Click the Parameters tab and enter
Name On Card for text.
For the second instance, enter ccType_lbl for the instance name and set the X and Y
coordinates to 5, 35. Click the Parameters tab and enter
Card Type for text.
For the third instance, enter ccNumber_lbl for the instance name and set the X and Y
coordinates to 5, 65. Click the Parameters tab and enter
Card Number for text.
For the fourth instance, enter ccExp_lbl for the instance name and set the X and Y
coordinates to 5, 95. Click the Parameters tab and enter
Expiration for text.
3.
Drag an instance of the TextInput component onto the Stage and position it to the right of the
ccName_lbl instance. Name the new instance ccName_cb.
4.
Drag an instance of the ComboBox component onto the Stage and position it to the right of
the ccType_lbl instance. Name the new instance ccType_cb.
5.
Drag another instance of the TextInput component onto the Stage and position it to the right
of the ccNumber_lbl instance. Name the new instance ccNumber_cb.
6.
Drag two instances of the ComboBox component onto the Stage. Position one to the right of
the ccExp_lbl instance, and position the other one to the right of that. Name the first new
instance ccMonth_cb, and name the second ccYear_cb.
7.
Drag an instance of the Button component onto the Stage and position it at the bottom of the
form, below the ccMonth_cb instance. Name the new instance checkout_button. In the
Property inspector’s Parameters tab, set the
label property to Checkout.
8.
Follow the instructions in steps 14-16 of the Billing Information instructions (see “Create
movie clips for the Billing Information pane” on page 28) to add a rectangle to the bottom of
the form.
Bind components to display product information from an
external source
In the beginning of the tutorial, you added instances of the DataGrid, DataSet, and
XMLConnector components to the Stage. You set the
URL property for the XMLConnector
(named products_xmlcon) to the location of an XML file containing product information for the
Gift Ideas section of the application.
Now you’ll use data binding features in the Flash authoring environment to bind the
XMLConnector, DataSet, and DataGrid components together to use the XML data in the
application. For general information on working with data binding and other features of the Flash
data integration architecture, see Chapter 14, “Data Integration (Flash Professional Only)” in
Using Flash.
When you bind the components, the DataSet component will filter the list of products in the
XML file according to the severity of the blunder that the user selects in the What Did You Do?
section. The DataGrid component will display the list.