MACROMEDIA FLEX-GETTING STARTED WITH FLEX, Начало работы, Страница: 31 / 86

About MXML 31
<!-- The user enters contact information in TextInput controls. -->
<mx:TextInput id="homePhoneInput"
text="This isn't a valid phone number."/>
<mx:TextInput id="cellPhoneInput" text="(999)999-999"/>
<mx:TextInput id="emailInput" text="me@somewhere.net"/>
</mx:Panel>
<!-- A data model called "contact" stores contact information.
The text property of each TextInput control shown above
is passed to a field of the data model. -->
<mx:Model id="contact">
<homePhone>{homePhoneInput.text}</homePhone>
<cellPhone>{cellPhoneInput.text}</cellPhone>
<email>{emailInput.text}</email>
</mx:Model>
<!-- Validator components validate data stored in the
fields of the contact data model. -->
<mx:PhoneNumberValidator field="contact.homePhone"/>
<mx:PhoneNumberValidator field="contact.cellPhone"/>
<mx:EmailValidator field="contact.email"/>
</mx:Application>
The following figure shows the application rendered in a web browser window:
For more information about using data models, see Chapter 31, “Managing Data in Flex,” in
Developing Flex Applications .
Formatting application-specific data
Formatter components are ActionScript components that perform a one-way conversion of raw
data to a formatted string. They are triggered just before data is displayed in a text field. Flex
includes a set of standard formatters. You can also create your own formatters. The following
example shows an application that uses the standard ZipCodeFormatter component to format the
value of a variable:
<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml">
<!-- Declare a ZipCodeFormatter and define parameters. -->
<mx:ZipCodeFormatter id="ZipCodeDisplay" formatString="#####-####" />
<mx:Script>
<![CDATA[
var storedZipCode=123456789;