4 Replies Latest reply on Apr 28, 2009 12:44 AM by Barna Biro

    user feedback with maxChar attribute on TextInput


      I have a textinput with maxChars=6


      i would like to have some sort of user feedback when they attempt to type the 7th char.  (red border, tooltip, etc...)


      what would be the ideal way to achieve this?


      I don't see where there is an event dispatched when a user tries to type the 7th char ?

        • 1. Re: user feedback with maxChar attribute on TextInput
          ATIF FAROOQ Level 3


             you can use change event of textfield and remove the maxChars=6 property

                                        change event handler should be like this


                                     function changeHandler(e:Event){






          and for redBorder you can use Form and apply stringValidator on your textField that length of characters in textField should be 6 or less if not then

          throw validation Errror . in that case flex shows red ToolTip on in front of the text field on which validation error occurred along with red border


             see this link for help on validators http://livedocs.adobe.com/flex/3/html/validators_3.html

          1 person found this helpful
          • 2. Re: user feedback with maxChar attribute on TextInput
            Barna Biro Level 3

            Hi there,


            The change event would be a solution but a slightly more efficient solution would be to simply listen for a keyDown event. Here's a fast example that hopefully will help you get on the right track:


            <?xml version="1.0" encoding="utf-8"?>
                xmlns:mx            ="http://www.adobe.com/2006/mxml"
                backgroundColor     ="#FFFFFF" 
                layout              ="absolute">
                        import mx.controls.Alert;
                        import mx.events.FlexEvent;
                        import mx.controls.TextInput;
                        private static const ALLOWED_MAX_CHARS:int = 6;
                        private function onInputFieldFill(event:KeyboardEvent):void
                            if (event.charCode != Keyboard.LEFT &&
                                event.charCode != Keyboard.RIGHT &&
                                event.charCode != Keyboard.UP &&
                                event.charCode != Keyboard.DOWN)
                                var target:TextInput = event.currentTarget as TextInput;
                                if (target.text.length > ALLOWED_MAX_CHARS - 1)
                                    target.text = target.text.slice(0, ALLOWED_MAX_CHARS);
                                    Alert.show("You tried to add 7 characters!", "ERROR");
                    width               ="100%"
                    height              ="100%"
                    horizontalAlign     ="center"
                    verticalAlign       ="middle">
                        id              ="userInputField"
                        keyDown         ="onInputFieldFill(event)"/>


            The code I posted is not perfect, it's an older file of mine that I have found and edited a bit so don't use it as it is.


            Blog: http://blog.wisebisoft.com

            With best regards,

            Barna Biro

            1 person found this helpful
            • 3. Re: user feedback with maxChar attribute on TextInput
              rotts2 Level 1

              at first i used this approach, but it did not work the way i expected


              I am using an Item editor on a DataGrid cell for input.


              I think my issue was that My ItemEditor was extending Label instead of TextInput

              • 4. Re: user feedback with maxChar attribute on TextInput
                Barna Biro Level 3

                Hi again,


                Somehow, I totally forgot that we have a TextEvent class that might come in handy in such situations. Check this out: http://livedocs.adobe.com/flex/3/langref/flash/events/TextEvent.html Creating to TEXT_INPUT instead of a generic KEY_DOWN event might be the solution ( you can obviously play around with the stuff and maybe come up with a different solution too ).


                With best regards,

                Barna Biro