Products
Technologies

Developer resources

TextArea with a prompt string that automatically disappears and reappears.

Avg. Rating 4.5
Tags:



Problem

I want a TextArea with a prompt string that displays when the TextArea first displays, automatically disappears when user clicks in the TextArea and reappears if the user clicks outside the TextArea without entering anything.

Solution

Create a custom MXML component as shown in the details.

Detailed explanation

----- TextAreaPrompt.mxml -----

<?xml version="1.0" encoding="utf-8"?>
<mx:TextArea xmlns:mx=" http://www.adobe.com/2006/mxml" text="{prompt}"
  focusIn="removeAddPrompt();" focusOut="removeAddPrompt();">
  <mx:Script>
    <![CDATA[
      private var _prompt:String;
     
      public function set prompt(str:String):void{
        this._prompt = str;
      }
     
      [Bindable]
      public function get prompt():String{
        return this._prompt;
      }

      private function removeAddPrompt():void{
        if(this.text == this.prompt){
          this.text = "";
        }else if(this.text == ""){
          this.text = this.prompt;      
        }
      }     
    ]]>
  </mx:Script> 
</mx:TextArea>

----- MainApp.mxml -----

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml"
  xmlns:comp="*">
  <mx:Text fontSize="14"
    text="click TextAreaPrompt to see its text disappear, then click here to see it reappear"/>
  <comp:TextAreaPrompt id="myTAP" height="100%" width="100%"
    prompt="enter details"/>
</mx:Application>
 


+
This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License. Permissions beyond the scope of this license, pertaining to the examples of code included within this work are available at Adobe.

Report abuse

Related recipes