Flex: Text Input that accepts number only

Question

Need a code that only accepts numbers. Upon inputting, the code must check if it is number, if not, it must remove the entered key or not enter it at all

Also see: http://stackoverflow.com/questions/6300528/flex-restrict-textinput-to-accept-only-decimal-numbers — Even Mien, Sep 20 '11 at 14:37

score 31 · Accepted Answer · answered Nov 17 '09 at 11:16

31

look at the restrict property on the TextInput class. Set it to "0-9"

answered Nov 17 '09 at 11:16

Gregor Kiddie

3,119
1
19
16

Yes, it's just ".0-9" if I recal correctly. Note that they'll be able to add more than one . if you do it this way. If you are restricting them to make a legal number, you'll need some extra AS to handle it. – Gregor Kiddie Nov 18 '09 at 07:44

score 13 · Answer 2 · answered Nov 17 '09 at 11:33

   <s:TextInput id="textInput"
                restrict="0-9"
                widthInChars="20"
                maxChars="20" />
   <mx:TextInput id="textInput"
                restrict="0-9"
                widthInChars="20"
                maxChars="20" />

score 3 · Answer 3 · answered Nov 06 '11 at 13:20

3

There's a control called NumericStepper.

See: http://livedocs.adobe.com/flex/3/html/help.html?content=controls_11.html

If you don't want the up and down arrows there, you can set their skin class to null.

Cheers, Sly

answered Nov 06 '11 at 13:20

sly1024

31
1

score 2 · Answer 4 · edited Sep 26 '11 at 17:43

<?xml version="1.0"?>
<!-- Simple example to demonstrate the TextInput control. -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" viewSourceURL="srcview/index.html">

    <mx:Panel title="Dodawanie dwóch liczb :)" height="279" width="238" 
        paddingTop="10" paddingLeft="10">

        <mx:TextInput id="src"
          restrict="0-9"
                maxChars="20" />
        <mx:TextInput id="dest"
          restrict="0-9"
                maxChars="20"/>

        <mx:Button label="dodaj" click= "dodaj();" id="but"/>
        <mx:Label text="Suma" width="59"/>
        <mx:Label text="0" width="160" id="wynik"/>

    </mx:Panel>
    <mx:Script>
     <![CDATA[
      import mx.formatters.NumberBase;
      public function dodaj():Number
      {
       var liczba:Number = Number(src.text) + Number(dest.text);
       wynik.text = liczba.toString();
       return 0;
      }

     ]]>
    </mx:Script>
</mx:Application>

score 1 · Answer 5 · answered Nov 18 '09 at 10:11

1

Look at mx.validators.NumberValidator: http://livedocs.adobe.com/flex/3/langref/mx/validators/NumberValidator.html

answered Nov 18 '09 at 10:11

Mihai Nita

5,547
27
27

Rahul Singhai · Answer 6 · 2013-11-06T13:52:59.153

I use somthing like

<s:TextInput id="textInput"
    restrict="0-9.\\-"
    change="onChangeNumberTextInput(event, 6)"/>

private function onChangeNumberTextInput(event:TextOperationEvent, precision:uint = 2):void
    {
        var strNumber:String = "";
        if (event.currentTarget is mx.controls.TextInput)
            strNumber = (event.currentTarget as mx.controls.TextInput).text;
        else if (event.currentTarget is spark.components.TextInput)
            strNumber = (event.currentTarget as spark.components.TextInput).text;
        else
            return;

        var ind:int = strNumber.indexOf(".");
        if (ind > -1)
        {
            var decimal:String = strNumber.substring(ind + 1);
            if (decimal.indexOf(".") > -1)
                strNumber = strNumber.substring(0, ind + 1 + decimal.indexOf("."));
            if (decimal.length > precision)
                strNumber = strNumber.substring(0, ind + 1 + precision);
        }

        if (event.currentTarget is mx.controls.TextInput)
            (event.currentTarget as mx.controls.TextInput).text = strNumber;
        else if (event.currentTarget is spark.components.TextInput)
            (event.currentTarget as spark.components.TextInput).text = strNumber;
    }

The change listener function removes everything beyond the number of precision characters from the decimal point, or any second occurrence of ".":

score 0 · Answer 7 · answered Apr 09 '13 at 03:15

0

You need to change the property so that the application only request the number keyboard from the application.

try 'SoftKeyboard"number" ; '

answered Apr 09 '13 at 03:15

Ryan Watts

611
1
9
27

score 0 · Answer 8 · edited Jul 27 '15 at 08:18

0

I'm not sure what exactly you want to do. If you just want to sum those two, use following

{parseInt(txt1.text) + parseInt(txt2.text)}

your example just concatenate those two strings. This one example try to convert text into number and then sum those two values.

edited Jul 27 '15 at 08:18

ketan

19,129
42
60
98

answered Apr 28 '10 at 22:09

zvjerka24

1,772
1
21
27

Flex: Text Input that accepts number only

8 Answers8