Different projects require varying solutions for handling the errors that the validation process brings to light. In some cases, you may wish to provide a graphical indicator (for example, a red X next to the field containing the error), while in others a text message may suffice. The conditional statement itself (within the validation routine) usually determines how to handle any error that it detects. Take, for example, the following: if (dataValid) { // perform these actions } else { // Execute action to denote an error Because error handling plays a major role in the validation process, you should think about how you want errors to be handled in a particular project or situation before you script anything else. In this exercise, we'll lay the foundation for the error handling process in our project. -
Open validate1.fla in the Lesson13/Assets folder. This project contains two scenes: Registration and Confirm. We'll work on the Confirm scene in a later exercise; for now, we'll concentrate on the Registration scene, which includes a form that the user must fill out, and thus data that needs to be validated. This scene contains four layers named according to their content: The Background layer contains the scene's graphical content with the exception of the buttons, which reside on the Buttons layer. The Text Fields layer contains five text fields. Four of the text fields are placed above background graphics that represent the form's input areas. From the top down, these fields are named name, email, state, and zip. Because the user will be required to enter data into these fields, they are input-text fields. To the right of these text fields is a larger text field named errorLog. This multiline dynamic text field will be used to display errors found in the form's validation process. If the Property inspector is open, you will note that the HTML option has been selected for this field. By selecting this option, you instruct Flash to enable this text field to interpret the HTML sent to it rather than display the actual code. -
With the Actions panel open, select Frame 1 on the Actions layer and add this script: stop (); errors = new Array(); The first action prevents the timeline from moving beyond Frame 1 of this scene until we instruct it to do so. The second action creates an array named errors that will hold error messages that need to be displayed as the result of the validation process. (We'll explain this in more detail as we move forward.) -
Add this function definition to the end of the current script: function clearForm () { name.text = ""; email.text = ""; state.text = ""; zip.text = ""; errorLog.text = ""; errors.length = 0; } When called, this function resets the value of scene elements including the input-text fields and the errorLog text field to their initial values. It also removes any error messages within the error array. -
With the Actions panel still open, select the Clear button at the bottom of the screen and add this script: on (release) { clearForm(); } This script calls the clearForm() function that we just defined, causing the actions within that function to be executed when the button is released. -
Save this file as validate2.fla. We'll build on this file throughout this lesson. The most important aspect of this exercise was the creation of the errors array, which will play a major role in the way our application handles any errors it detects in the validation process. |