How can I set "maxChars" of the TextInput in an editable ComboBox?

Question

I want to set the maxChars property of the TextInput of an editable ComboBox. I am currently trimming the text to a set number of characters using a change Event:

private function nameOptionSelector_changeHandler(event:ListEvent):void
{
    nameOptionSelector.text = nameOptionSelector.text.substr(0, MAX_LENGTH);
}

This feels like overkill. There's got to be a better way to do this....

Answer 1

You could extend ComboBox and override the default maxChars value for the internal TextInput. If you need to set it dynamically, you could add a public method to set the property on the extended class.

Answer 2

Using the suggestion of Stiggler, here is the full solution I implemented:

package
{
    import mx.controls.ComboBox;

    public class ComboBoxWithMaxChars extends ComboBox
    {
        public function ComboBoxWithMaxChars()
        {
            super();
        }

        private var _maxCharsForTextInput:int;

        public function set maxCharsForTextInput(value:int):void
        {
            _maxCharsForTextInput = value;

            if (super.textInput != null && _maxCharsForTextInput > 0)
                super.textInput.maxChars = _maxCharsForTextInput;
        }

        public function get maxCharsForTextInput():int
        {
            return _maxCharsForTextInput;
        }

        override public function itemToLabel(item:Object):String
        {
            var label:String = super.itemToLabel(item);

            if (_maxCharsForTextInput > 0)
                label = label.substr(0, _maxCharsForTextInput);

            return label;
        }
    }
}

Answer 3

This was a great idea, but it no longer works for Flex 3.5, do you have any suggestions?

Answer 4

My alternative is to use the protected textInput directly. This approach allows the "maxChars" property to be set in the GUI builder or code, just as you would for a normal TextField. Note that zero is a valid value for maxChars and indicates unlimited characters. The override of .childrenCreated() is needed to avoid attempting to set maxChars before the TextInput object exists.

package my.controls
{
    import mx.controls.ComboBox;

    public class EditableComboBox extends ComboBox
    {
        public function EditableComboBox()
        {
            super();
        }

        private var _maxChars:int = 0;

        override protected function childrenCreated():void
        {
            super.childrenCreated();

            // Now set the maxChars property on the textInput field.
            textInput.maxChars = _maxChars;
        }

        public function set maxChars(value:int):void 
        {
            _maxChars = value;
            if (textInput != null && value >= 0)
                textInput.maxChars = value;
        }

        public function get maxChars():int 
        {
            return textInput.maxChars;
        }

  }
}

Answer 5

Don't have enough rep points to comment, but I wanted to say that Mark Ash's response from Jan 27, 2010 worked for me in Flex 3.5. Thanks Mark!