Introduction to Components Tutorial > Create a form > Write ActionScript to gather the data |  |

Write ActionScript to gather the data

Some of the ActionScript will be for the entire movie, while some will be related to a particular frame. The following table will help you keep track of instance names.

Instance name | Description
--- | ---
color_box | Color combo box on page 1
sweepstakes_box | Sweepstakes check box on page 1
submit_btn | Submit push button on page 1
name | Input text box for name on page 1
email | Input text box for e-mail address on page 1
return_btn | Return push button on page 2
name_result | Dynamic text box on page 2 to display the user's name
email_result | Dynamic text box on page 2 to display the user's e-mail address.
color_result | Dynamic text box on page 2 to display the user's color selection
sweepstakes_text | Dynamic text box on page 2 that displays different text if the user has chosen or not chosen to enter the sweepstakes

Write ActionScript for the entire movie

ActionScript for components is placed in keyframes. The Click Handler parameter specifies what happens when the PushButton component is activated. The default value is `onClick`, which means that when the user clicks one of the push buttons, it is activated. We will begin by creating a function for `onClick`. This will be a branching function that will first determine whether the button pushed was the Submit or the Return button, then carry out actions accordingly.

1 | Create a new layer and name it All Actions. This will be used for ActionScript that should run throughout the movie.
2 | If the Actions panel is not open, choose Window > Actions.
3 | Switch to expert mode by pressing Control+Shift+E (Windows) or Command+Shift+E (Macintosh), or by clicking the control in the upper right corner (a triangle with a check mark above it) and selecting Expert Mode from the pop-up menu.
4 | First, enter the callback function for the push buttons. This is a conditional statement that branches depending on which button is clicked. If the Submit button is clicked, it will branch to the `getResults` function and go to page 2. If the Return button is clicked, it will go to page 1.
| Enter the following code in the Actions panel.
    // push button callback
    function onClick(btn) {
    	if (btn == submit_btn) {
    		getResults();
    		gotoAndStop("pg2");
    	} else if (btn == return_btn) {
    		gotoAndStop("pg1");
    	}
    }
| Note: Although it is not recommended, if you don't want to write the ActionScript, you can copy the text from this tutorial and paste it into the Actions panel.
5 | Now, write the `getResults` function. This gets the results from the sweepstakes check box and the color combo box. It gets the results from the combo box as a label so it can show the results.
    // get results from pg 1
    function getResults() {
    	sweepstakes_result = sweepstakes_box.getValue();
    	color_result = color_box.getSelectedItem().label;
    	selectedItem = color_box.getSelectedIndex();
    }
6 | Next, write the `initValues` function. This initializes the values on page 1 with the values the user has previously selected. It is run when the user clicks the Return button.
    // initialize the values on pg 1 with the values the user has previously selected
    function initValues() {
    	sweepstakes_box.setValue(sweepstakes_result);
    	if (!started) {
    		color_box.setSelectedIndex(0);
    		started = true;
    	} else {
    		color_box.setSelectedIndex(selectedItem);
    	}
    }
7 | Finally, add a call to the `initValues` function to the beginning of the ActionScript. When you finish, the ActionScript should look like this:
    initValues();
    // push button callback
    function onClick(btn) {
    	if (btn == submit_btn) {
    		getResults();
    		gotoAndStop("pg2");
    	} else if (btn == return_btn) {
    		gotoAndStop("pg1");
    	}
    }
    // initialize the values on pg 1 with the values the user has previously selected
    function initValues() {
    	sweepstakes_box.setValue(sweepstakes_result);
    	if (!started) {
    		color_box.setSelectedIndex(0);
    		started = true;
    	} else {
    		color_box.setSelectedIndex(selectedItem);
    	}
    }
    // get results from pg 1
    function getResults() {
    	sweepstakes_result = sweepstakes_box.getValue();
    	color_result = color_box.getSelectedItem().label;
    	selectedItem = color_box.getSelectedIndex();
    }

You have completed the script that needs to run for the entire movie. However, you still need to add script for the frames in page 1 and page 2.

Add ActionScript to each keyframe

Some of the ActionScript needs to be executed only when a user selects a particular frame. In order to make the ActionScript work, you need to name each keyframe.

1 | Create a new layer and name it Frame Actions. Select Frame 1, then choose Insert > Blank Keyframe to insert a keyframe. Use the Property inspector to name the keyframe pg1. In the same manner, insert a keyframe at Frame 6 and name it pg2.
2 | Select the keyframe in Frame 1 of the Frame Actions layer and write the following ActionScript to stop the movie at Frame 1 (pg1):
    stop();
3 | (Optional) If you want to display certain text if the user has selected the sweepstakes check box and other text if the user has not, you can write a conditional statement with text that will go into the sweepstakes_text dynamic text field on page 2. Select the keyframe named pg2 in the Frame Actions layer and enter the following in the Actions panel:
    // sweepstakes text
    if (sweepstakes_result==true) {
    	sweepstakes_text = "You have been entered in the Stiletto Fantasy sweepstakes. Winners are announced at the end of each month.";
    } else {
    	sweepstakes_text = "You have not been entered in the Stiletto Fantasy sweepstakes.";
    }
| Note: Do not cut and paste this ActionScript into the Actions panel. It will not work properly, because there are line breaks between the first and second lines of text.