Solved

Text formatting disappears when I clear my textfield

Posted on 2013-06-04
10
372 Views
Last Modified: 2013-06-17
Hey there.

Hope someone can help me here..

I have a textfield with some defaultTextFormat – if the user hasn't typed anything in the textfield the textfield will have the following text: "Write caption here.." - this text is in grey.

What I want is that if the user clicks the textfield the text goes away and the text color changes to black when the user starts typing. The annoying thing is that If I keep one character in the textfield it changes the color correctly to black, but if I clear the textfield as I want to the new textFormat is not applied.

Please have a look at the code here:

// activate caption textfield
		private function activateCapTxtFld(e:FocusEvent):void {
			trace("activateTxtFld: captionNotSet = "+captionNotSet);
			if(captionNotSet) {
				captionTxt.text = "test"; // the new textformat is applied
				//captionTxt.text = ""; // the new textformat is NOT applied
				var TF:TextFormat = new TextFormat();
				TF.color = 0x000000;
				captionTxt.setTextFormat(TF);
			}
			e.target.removeEventListener(FocusEvent.FOCUS_IN, activateCapTxtFld);
		}

Open in new window



I hope someone can help me on this..

Thanks..
0
Comment
Question by:RapperOnStep
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 5
  • 3
10 Comments
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 39226197
Without a link to the page so we can see what is happening, there is nothing we can do but guess.  My guess is that the text is a placeholder in a textarea, and the behavior you are describing in the native implementation in a modern browser, and AFAIK it is not overridable.

Cd&
0
 

Author Comment

by:RapperOnStep
ID: 39231248
hey Cd&.

Thanks for your answer. Just cleaned up the coding and attaching an example here with all the code neccessary. I hope you can help me shine some light on this problem.

package {
	
	import flash.display.*;
	import flash.events.*;
	import flash.text.TextFormat;
	import flash.text.TextField;
	import flash.text.TextFieldAutoSize;
	import flash.text.TextFieldType;
	import flash.text.AntiAliasType;
	import flash.events.FocusEvent;
	
	
	public class setSelection2 extends MovieClip {
		
		private var captionNotSet:Boolean;
		private var headlineNotSet:Boolean;
		private var captionTxtFormat:TextFormat;
		private var headlineTxtFormat:TextFormat;
		private var defaultTxtFormat:TextFormat;
		public var headlineTxtFld:TextField;
		public var captionTxt:TextField;
		private var caption:String;
		private var headline:String;
		
		
		public function setSelection2() {
			setDefaultTxt();
			addCaptionTxtFld();
		}
		private function setDefaultTxt():void {
			caption = "Write caption here..";
			captionNotSet = true;
		}
		
		private function setDefaultTxtFormat(textIsNotSet:Boolean):void {
			
			trace("setDefaultTxtFormat");
			defaultTxtFormat = new TextFormat();
			defaultTxtFormat.font = "Georgia";
			defaultTxtFormat.size = 16;
			if(textIsNotSet) {
				defaultTxtFormat.color = 0x666666;
			}
			else {
				defaultTxtFormat.color = 0x000000;
			}
			
		}
		
		
		
		// addCaptionTxtFld
		private function addCaptionTxtFld():void {
			captionTxt = new TextField();
			captionTxt.type = TextFieldType.INPUT;
			captionTxt.height = 55;
			captionTxt.background = true;
			captionTxt.border = true;
			captionTxt.wordWrap = true;
			captionTxt.antiAliasType = AntiAliasType.ADVANCED;
			captionTxt.width = 500;
			captionTxt.height = 300;
			captionTxt.x = 20;
			captionTxt.y = 20;
			captionTxt.htmlText = caption;
			setDefaultTxtFormat(captionNotSet);
			captionTxt.setTextFormat(defaultTxtFormat);
			captionTxt.addEventListener(FocusEvent.FOCUS_IN, activateCapTxtFld);
			addChild(captionTxt);
			captionTxt.defaultTextFormat = defaultTxtFormat;
		}
		
		
		// activate caption textfield
		private function activateCapTxtFld(e:FocusEvent):void {
			if(captionNotSet) {
				//captionTxt.text = "test"; // the new textformat is applied
				captionTxt.text = ""; // the new TF textformat is NOT applied
				var TF:TextFormat = new TextFormat();
				TF.color = 0x000000;
				TF.size = 20;
				captionTxt.setTextFormat(TF);
			}
			e.target.removeEventListener(FocusEvent.FOCUS_IN, activateCapTxtFld);
		}
		
		
	}
}

Open in new window

0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 39242004
Still waiting for a link.

Cd&
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Author Comment

by:RapperOnStep
ID: 39242136
Why do u need a link? I posted all the code to make it easier..
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 39242180
Fine. I am moving on to other things.  Good luck finding an answer.

Cd&
0
 

Author Comment

by:RapperOnStep
ID: 39242458
Wauw... I'm not an expert - that's why I'm asking.
0
 

Accepted Solution

by:
RapperOnStep earned 0 total points
ID: 39243818
I solved it myself. Strange behaviour - I never posted a link in here before. Always just the code.

Here is the solution:

package 
{

	import flash.display.*;
	import flash.events.*;
	import flash.text.TextFormat;
	import flash.text.TextField;
	import flash.text.TextFieldAutoSize;
	import flash.text.TextFieldType;
	import flash.text.AntiAliasType;
	import flash.events.FocusEvent;


	public class setSelection2 extends MovieClip
	{

		private var captionNotSet:Boolean;
		private var headlineNotSet:Boolean;
		private var captionTxtFormat:TextFormat;
		private var headlineTxtFormat:TextFormat;
		private var defaultTxtFormat:TextFormat;
		public var headlineTxtFld:TextField;
		public var captionTxt:TextField;
		private var caption:String;
		private var headline:String;


		public function setSelection2()
		{
			setDefaultTxt();
			addCaptionTxtFld();
		}
		private function setDefaultTxt():void
		{
			caption = "Write caption here..";
			captionNotSet = true;
		}

		private function setDefaultTxtFormat(textIsNotSet:Boolean):void
		{

			defaultTxtFormat = new TextFormat();
			defaultTxtFormat.font = "Georgia";
			defaultTxtFormat.size = 16;
			defaultTxtFormat.color = 0x666666;
		}



		// addCaptionTxtFld
		private function addCaptionTxtFld():void
		{
			captionTxt = new TextField();
			captionTxt.type = TextFieldType.INPUT;
			captionTxt.height = 55;
			captionTxt.background = true;
			captionTxt.border = true;
			captionTxt.wordWrap = true;
			captionTxt.antiAliasType = AntiAliasType.ADVANCED;
			captionTxt.width = 500;
			captionTxt.height = 300;
			captionTxt.x = 20;
			captionTxt.y = 20;
			captionTxt.htmlText = caption;
			setDefaultTxtFormat(captionNotSet);
			captionTxt.setTextFormat(defaultTxtFormat);
			captionTxt.addEventListener(MouseEvent.CLICK, activateCapTxtFld);
			addChild(captionTxt);
			captionTxt.defaultTextFormat = defaultTxtFormat;
		}


		// activate caption textfield
		private function activateCapTxtFld(e:MouseEvent):void
		{
			if (captionNotSet) {
				captionTxt.text = " ";
				var newformat:TextFormat = new TextFormat();
				newformat.color = 0x000000;
				captionTxt.setTextFormat(newformat);
				captionTxt.setSelection(0,0);
			}
			e.target.removeEventListener(MouseEvent.CLICK, activateCapTxtFld);
		}


	}
}

Open in new window

0
 

Author Closing Comment

by:RapperOnStep
ID: 39252629
For some reason I didn't get a solution from an expert so I had to solve it myself :(
0

Featured Post

Why Off-Site Backups Are The Only Way To Go

You are probably backing up your data—but how and where? Ransomware is on the rise and there are variants that specifically target backups. Read on to discover why off-site is the way to go.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

This article was originally published on Monitis Blog, you can check it here . Today it’s fairly well known that high-performing websites and applications bring in more visitors, higher SEO, and ultimately more sales. By the same token, downtime…
CTAs encourage people to do something specific to show interest in your company, product or service. Keep reading to learn why CTAs should always be thought of as extremely important, albeit small, sections of websites.
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).

752 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question