Hiding the text field on an MX DateField control in Flex 3

DateField, , ,

The following example shows how you can hide the text input field on the MX DateField control in Flex 3 by setting the Boolean visible and includeInLayout properties on the internal text field (using the getTextField() method in the mx_internal namespace).

Since this example uses the mx_internal namespace, you can't always depend on this behavior to work in future versions of the Flex SDK. Use at your own risk.

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2010/03/28/hiding-the-text-field-on-an-mx-datefield-control-in-flex-3/ -->
<mx:Application name="MX_DateField_getTextInput_test"
                xmlns:mx="http://www.adobe.com/2006/mxml"
                layout="vertical"
                verticalAlign="top"
                backgroundColor="white">
 
    <mx:Script>
        <![CDATA[
            import mx.controls.TextInput;
 
            protected function init():void {
                var tf:TextInput = df.mx_internal::getTextInput();
                tf.visible = false;
                tf.includeInLayout = false;
            }
        ]]>
    </mx:Script>
 
    <mx:DateField id="df" initialize="init();" width="23" />
    <mx:Label text="{df.selectedDate}" />
 
</mx:Application>

4 thoughts on “Hiding the text field on an MX DateField control in Flex 3”

Comments are closed.