MACROMEDIA FLEX BUILDER-USING FLEX BUILDER Use Manual page 66

•
"Retrieve the product selection" on page 67
•
"Display the product detail" on page 68
Detect the product in the GridView component
The first task is to modify the GridView component so it can detect when a user clicks a product.
Open the GridView.mxml file located in the fbBindings folder and enter the following tag after
1.
the opening
<mx:VBox>
<mx:Metadata>
[Event("change")]
</mx:Metadata>
Locate the
2.
<mx:Script>
<mx:Script>
var dataObject;
var selectedItem;
</mx:Script>
You want to use this local variable to store the product the user selected.
Locate the
3.
<mx:DataGrid>
<mx:DataGrid id="list"
dataProvider="{dataObject}"
change="selectedItem=event.target.selectedItem;
dispatchEvent({type:'change'})"
...
Save the GridView.mxml file.
4.
Detect the product in the ThumbnailView component
You also modify the ThumbnailView component so it can detect when the user clicks a product
and what the product is.
Open the ThumbnailView.mxml file located in the fbBindings folder and enter the following
1.
tag after the opening
<mx:Metadata>
[Event("change")]
</mx:Metadata>
Locate the
2.
<mx:Script>
<mx:Script>
var dataObject;
var selectedItem;
</mx:Script>
Locate the
3.
<ProductThumbnail>
<ProductThumbnail id="product"
xmlns="*"
dataObject="{list.currentItem}"
mouseDown="selectedItem=event.target.dataObject;
dispatchEvent({type:'change'})" />
Save the ThumbnailView.mxml file.
4.
66 Chapter 2: Flex Builder Tutorials
tag:
tag and add the following variable declaration (shown in bold type):
tag and add the following property (shown in bold type):
tag:
<mx:VBox>
tag and add the following variable declaration (shown in bold type):
tag and add the following property (shown in bold type):