User Guide
38 Chapter 2: Creating an Application with Components (Flash Professional Only)
Resetting the filtered property (setting it to false and then to true) at the beginning of the
change() function ensures that the function will work properly if the user changes the What Did
You Do? selection repeatedly.
The
filterFunc function checks whether a given item in the array of gifts falls within the
severity the user selected in the combo box. If the gift is within the selected severity range, it is
displayed in the DataGrid instance (which is bound to the DataSet instance).
The last line of code registers the listener to the problems_cb ComboBox instance.
Add an event listener to display product details
Next you’ll add an event listener to the products_dg DataGrid instance to display information
about each product. When the user clicks a product in the Gift Ideas section, a pop-up window
appears with information about the product.
• In the Actions panel, add the following code:
// create a listener for the DataGrid to detect when the row in the
// DataGrid is changed
var dgListener:Object = new Object();
dgListener.change = function(evt:Object) {
// when the current row changes in the DataGrid, launch a new pop-up
// window displaying the product's details
myWindow = mx.managers.PopUpManager.createPopUp(_root,
mx.containers.Window, true, {title:evt.target.selectedItem.name,
contentPath:"ProductForm", closeButton:true});
// set the dimensions of the pop-up window
myWindow.setSize(340, 210);
// define a listener that closes the pop-up window when the user clicks
// the close button
var closeListener:Object = new Object();
closeListener.click = function(evt) {
evt.target.deletePopUp();
};
myWindow.addEventListener("click", closeListener);
};
products_dg.addEventListener("change", dgListener);
This code creates a new event listener called dgListener, and creates instances of the Window
component you added to the library earlier. The title for the new window is set to the product’s
name. The content path for the window is set to the ProductForm movie clip. The size of the
window is set to 340 x 210 pixels.
The code also adds a close button to enable the user to close the window after viewing the
information.