Problem with the Flash Contact Form

Question

Hi, In Flash (AS3) Iam creating a contact form in that i have taken one " Submit Button" , one " Reset Button", four input text fields " Name, Email, Subject, Message" with instance names " contact_name, contact_email, contact_subject, contact_message"

Iam very much confused about setFocus and killFocus.

In AS3, i have given

contact_name.text = "Name";
contact_email.text= "Email";
contact_subject.text = "Sub";
contact_message.text = "Message";

Now when i publish this file, bydefault the input text field shows with text "Name, Email, Sub, Message"

Now my requirement is if i click on Name Field so the text "Name" should get disappear so that i can enter my name, after that i click on Email field the text "Email" should get disappear at the same time i don't want to lose my Name which is entered in Name Field.

If i click in Subject text Field the text "Sub" should get disappear but not to lose the Name and Email data entered by me.

If i click in Message text Field the text "Message" should get disappear but i don't want to lose the data which was entered in remaining text fields.

Please see the action script below. Please help me to find the solution.

Action Script :

contact_name.text ="Name";
contact_email.text ="Email";
contact_subject.text = "Sub";
contact_message.text ="Message";
message_status.text = "";

send_button.addEventListener(MouseEvent.CLICK, submit);
reset_button.addEventListener(MouseEvent.CLICK, reset);

var timer:Timer;
var var_load:URLLoader = new URLLoader;
var URL_request:URLRequest = new URLRequest( "send_email.php" );
URL_request.method = URLRequestMethod.POST;

function submit(e:MouseEvent):void
{
if( contact_name.text == "Name" || contact_email.text == "Email" ||
 contact_subject.text == "Sub" || contact_message.text == "Message" )
{
 message_status.text = "Please fill up all text fields.";
}
else if( !validate_email(contact_email.text) )
{
 message_status.text = "Please enter the valid email address.";
}
else
{
 message_status.text = "sending...";

 var email_data:String = "name=" + contact_name.text
       + "&email=" + contact_email.text
       + "&subject=" + contact_subject.text
       + "&message=" + contact_message.text;

 var URL_vars:URLVariables = new URLVariables(email_data);
 URL_vars.dataFormat = URLLoaderDataFormat.TEXT;

 URL_request.data = URL_vars;
 var_load.load( URL_request );
 var_load.addEventListener(Event.COMPLETE, receive_response );
}
}

function reset(e:MouseEvent):void
{
contact_name.text ="Name";
    contact_email.text ="Email";
    contact_subject.text = "Sub";
    contact_message.text ="Message";
    message_status.text = "";
}

function validate_email(s:String):Boolean 
{
var p:RegExp = /(\w|[_.\-])+@((\w|-)+\.)+\w{2,4}+/;
var r:Object = p.exec(s);
if( r == null ) 
{
 return false;
}
return true;
}

function receive_response(e:Event):void
{
var loader:URLLoader = URLLoader(e.target);
    var email_status = new URLVariables(loader.data).success;

if( email_status == "yes" )
{
 message_status.text = "Success! Your message was sent.";
 timer = new Timer(500);
 timer.addEventListener(TimerEvent.TIMER, on_timer);
 timer.start();
}
else
{
 message_status.text = "Failed! Your message cannot sent.";
}
}

function on_timer(te:TimerEvent):void 
{
if( timer.currentCount >= 10 )
{
 contact_name.text = contact_email.text = contact_subject.text = 
 contact_message.text = message_status.text = "";
 timer.removeEventListener(TimerEvent.TIMER, on_timer);
}
}

Thanks --vamsi

Answer 1

Assuming your contact_name is a Button you can add an event listener that resets the text property when a user clicks on this field. Something like:

contact_name.addEventListener(
             MouseEvent.CLICK, 
             function(e:Event):void { 
                 contact_name.text = ''; 
             }
);

Answer 2

I would use the focusIn event instead of click, since tabbing through your textfields wouldn't empty them... Also, when you focusOut from the textfield leaving it empty, it should refill with its label text...

var defaultText="Name";
addEventListener(FocusEvent.FOCUS_IN, function() {
   if(text==defaultText) {
      text="";
   }
}
addEventListener(FocusEvent.FOCUS_OUT, function() {
   if(text=="") {
      text=defaultText;
   }
}