Search Flex Samples

Limiting the amount of text you can enter into a Flex TextArea control

e following example shows how you can limit the amount of text a user can enter into a TextArea control by using the maxChars property.





<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"

layout="vertical"

verticalAlign="middle"

backgroundColor="white">



<mx:Script>

<![CDATA[

private function textArea_change(evt:Event):void {

var ta:TextArea = evt.currentTarget as TextArea;

progressBar.setProgress(ta.length, ta.maxChars);

}



private function progressBar_progress(evt:ProgressEvent):void {

var pb:ProgressBar = evt.currentTarget as ProgressBar;

if (pb.percentComplete > 95) {

pb.setStyle("themeColor", "red");

} else if (pb.percentComplete > 80) {

pb.setStyle("themeColor", "yellow");

} else {

pb.setStyle("themeColor", "haloGreen");

}

}

]]>

</mx:Script>



<mx:Panel>

<mx:TextArea id="textArea"

width="320"

height="120"

maxChars="300"

change="textArea_change(event);" />

<mx:ControlBar>

<mx:ProgressBar id="progressBar"

mode="manual"

minimum="0"

maximum="{textArea.maxChars}"

label="%1 of %2 characters (%3%%)"

labelPlacement="center"

width="100%"

progress="progressBar_progress(event);" />

</mx:ControlBar>

</mx:Panel>


</mx:Application>

0 comments:

Related Flex Samples

Learn Flex: Flex Samples | Flex Video Tutorials Flex Examples