Using the TextInput component

You can use a TextInput component wherever you need a single-line text field. If you need a multiline text field, use the TextArea component. For example, you could use a TextInput component as a password field in a form. You could set up a listener that checks if field has enough characters when a user tabs out of the field. That listener could display an error message indicating that the proper number of characters must be entered.

TextInput component parameters

The following are authoring parameters that you can set for each TextInput component instance in the Property inspector or in the Component Inspector panel:

text specified the contents of the TextInput. You cannot enter carriage returns in the Property inspector or Component Inspector panel. The default value is "" (empty string).

editable indicates whether the TextInput component is editable (true) or not (false). The default value is true.

password indicates whether the field is a password field (true) or not (false). The default value is false.

You can write ActionScript to control these and additional options for TextInput components using its properties, methods, and events. For more information, see TextInput class.

Creating an application with the TextInput component

The following procedure explains how to add a TextInput component to an application while authoring. In this example, the component is a password field with an event listener that determines if the proper number of characters have been entered.

To create an application with the TextInput component, do the following:

  1. Drag a TextInput component from the Components panel to the Stage.
  2. In the Property inspector, enter the instance name passwordField.
  3. In the Property inspector, do the following:
    • Leave the text parameter blank.
    • Set the editable parameter to true.
    • Set the password parameter to true.
  4. Select Frame 1 in the Timeline, open the Actions panel, and enter the following code:
    textListener = new Object();
    textListener.handleEvent = function (evt){
      if (evt.type == "enter"){
        trace("You must enter at least 8 characters");
      }
    }
    passwordField.addEventListener("enter", textListener);
    

    This code sets up an enter event handler on the TextInput passwordField instance that verifies that the user entered the proper number of characters.

  5. Once text is entered in the passwordField instance, you can get its value as follows:
    var login = passwordField.text;