About working with data in Flex Builder -- Flex 2.01

You work with data in Flex Builder by directly modifying your Flex and ActionScript application code. This section provides an overview of working with data and includes references to in-depth information in Flex 2 Developer's Guide.

Data-driven controls and containers

Flex provides you with control and container components from which you build your Flex application user interface. A number of these components present data to users, which they can select and interact with when using the application. A few examples of how data-driven controls are used include the following:

Common to all of the data-driven controls is that you provide data input to them with a data provider (discussed in the next section).

For information about using the data-driven controls, see Using Data-Driven Controls in Flex 2 Developer's Guide.

Data providers and collections

A data provider is a collection of objects that contains data required by a component. Because the data provider is separate from the component, it can be used by multiple components and is in this sense a "model" that can be used by many views.

The following is a simple example of how a data provider is defined (as an ActionScript array) and used by a control:

<mx:Application>
    <mx:Script><![CDATA[
    public var stateArray:Array = ["AL", "AK", "AR"]; 
    ]]></mx:Script>
    <mx:ComboBox id="stateCB0" dataProvider="{stateArray}" /> 
</mx:Application>

Data binding

In the code example from the previous section, you may have noticed that the value of the ComboBox control's dataProvider property is "{stateArray}". This is an example of data binding.

A data binding copies the value of an object (the source) to another object (the destination). After an object is bound to another object, changes made to the source are automatically reflected in the destination.

The following example binds the text property of a TextInput control (the source) to the text property of a Label control (the destination) so that text entered in the TextInput control is displayed by the Label control:

Data models

A data model is an object you can use to temporarily store data in memory so that it can be easily manipulated. You can define a data model in ActionScript, in MXML using a tag such as <mx:Model>, or any object that contains properties. As an example, the following data model shows information such as a person's name, age, and phone number:

<mx:Model id="Employee">
    <name>
        <first>Jennifer</first>
        <last>Nadeau</last>
    </name>
    <age>30</age>
    <work_tel>555-555-5555</work_tel>
</mx:Model>

The fields of a data model can contain static data (as in the example), or you can use data binding to pass data to and from the data model.

You can also define the data model within an XML file. You then reference the XML file through the file system or through a URL using the <mx:Model> tag's source property, as the following example shows:

<mx:Model source="content.xml" id="Contacts"/>
<mx:Model source="http://www.somesite.com/companyinfo.xml" id="myCompany"/>

For more information about data models, see Storing Data in Flex 2 Developer's Guide.

Data validation

You use data validation to ensure that the data the user enters into your application is valid. For example, if you want the user to enter a valid ZIP code you use a ZIP code data validator.

Flex provides predefined data validators for the following types of data: credit card, currency, date, e-mail, number, phone number, regular expression, social security, string, and ZIP code.

Data validators are nonvisual Flex components, which means that you do not access them from the Components panel. Instead, you work with them in code, as the following MXML example shows:

<!-- Define the ZipCodeValidator. -->
    <mx:ZipCodeValidator id="zcV" source="{zipcodeInput}" property="text"/>
<!-- Define the TextInput control for entering the zip code. -->
    <mx:TextInput id="zipcodeInput"/>

In this MXML example, the validator is defined with the appropriate MXML tag and it is bound to the ID property of a TextInput control. At run time, when the user enters the phone number into the TextInput control, the number is immediately validated.

You can, of course, use data validators in ActionScript by defining a variable as an instance of a validator class and then creating a function to bind it to the input control.

Data validators are often used with data models. For more information, see Validating Data in Flex 2 Developer's Guide.

Data formatting

To display the proper format of certain types of data in your application, you use a data formatter. Flex provides predefined data formatters for the following types of data: currency, date, number, phone, and ZIP code.

Data formatters are bound to input controls and they properly format data after it has been entered by the user. For example, a user may enter a date in this format:

Bound to the text input control is a data formatter that stores and displays the date in this format:

As with data validators, data formatters are nonvisual Flex components that you may work with either as MXML tags or ActionScript classes.

Data services

When your applications have complex requirements for accessing and managing data, you use advanced data services that help you move data to and from your applications.

In Flex, data services are included as part of Flex Data Services, a separate product (see About Flex Data Services in Getting Started with Flex 2). When you install Flex Data Services, you can use Flex Builder to create projects that implement the following data services:

RPC Services allow you to send and receive data using the following remote procedure call (RPC) services: HTTPService, WebService, and RemoteObject. Both HTTPService and WebService can be used by any Flex application. The RemoteObject service requires an additional server, such as Flex Data Services, to process the RemoteObject requests. Each enables you to make asynchronous requests to remote services that process the requests and then returns data directly to your Flex application. For more information, see About RPC services in Flex 2 Developer's Guide.

Flex Data Management Service allows you to create applications that work with distributed data and to also manage large collections of data and nested data relationships, such as one-to-one and one-to-many relationships. For more information, see About the Data Management Service in Flex 2 Developer's Guide.

Flex Message Service allows you to create applications that can send messages to and receive messages from other applications, including Flex applications and Java Message Service (JMS) applications. For more information, see About messaging in Flex 2 Developer's Guide.

Learn more about working with data

If you haven't already done so, review the getting started lessons Retrieve and Display Data and Use Web Services in Getting Started with Flex 2. For more information about working with data, see the Flex 2 Developer's Guide topics noted above.