TextInputで文字と文字数の制限をする

TextInputでの文字と文字数の制限方法の紹介です。


文字の制限は、
英字のA〜Zをだけを入力できるようにしたいとか、
数字の0〜9までを入力できるようにしたいとか、
英数字でA〜Zと0〜9まで入力できるようにしたいとか、
です。


方法は簡単です。
TextInputクラスに"restrict"というプロパティがあるので、
それに文字の制限を指定してあげるだけでOKです。


たとえば、A〜Zだけを入力できるようにしたいのであれば、
restrict="[A-Z]"
とするだけです。
英数字であっても、
restrict="[A-Z,0-9]"
とコンマで区切ってあげて、プラスの設定をするだけです。


このように簡単に実装できます。


次に、文字数制限ですが、
TextInputクラスの"maxChars"というプロパティがあるので、
それに文字数の制限数を設定してあげればOKです。


３文字制限にしたいのであれば、
maxChars="3"とするだけ！！
簡単ですねｗ


今回は、適当にサンプルソースを載せておきます。
自分のメモ程度に書いているので、
適当な書き方ですみません…;;

<?xml version="1.0" encoding="utf-8"?>
<!-- TextInputコンポーネントの文字と文字数の制限方法 -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
	<mx:VBox width="100%" height="100%">
		<!-- A~Zしか入力できなくする -->
		<mx:HBox width="100%" horizontalAlign="center">
			<mx:Label text="A~Zしか入力できない"/>
			<mx:TextInput restrict="[A-Z]"/>
		</mx:HBox>
		
		<!-- 0~9しか入力できなくする -->
		<mx:HBox width="100%" horizontalAlign="center">
			<mx:Label text="0~9しか入力できない"/>
			<mx:TextInput restrict="[0-9]"/>
		</mx:HBox>
		
		<!-- a~zしか入力できなくする -->
		<mx:HBox width="100%" horizontalAlign="center">
			<mx:Label text="a~zしか入力できない"/>
			<mx:TextInput restrict="[a-z]"/>
		</mx:HBox>
		
		<!-- A~Zとa~zしか入力できなくする -->
		<mx:HBox width="100%" horizontalAlign="center">
			<mx:Label text="A~Zとa~zしか入力できない"/>
			<mx:TextInput restrict="[A-z,a-z]"/>
		</mx:HBox>
		
		<!-- 文字数制限をする（３文字制限） -->
		<mx:HBox width="100%" horizontalAlign="center">
			<mx:Label text="3文字までしか入力できない"/>
			<mx:TextInput maxChars="3"/>
		</mx:HBox>
	</mx:VBox>
</mx:Application>