Using the DataSet Component

Youve seen how we can bind XML data directly to UI components. This works well if you have data that you dont need to update. However, if you want to make changes in Flash, youll have to add DataSet and XUpdateResolver components to keep track of your updates. Let me say at the outset that this is not for the faint of heart.

You can use the DataSet component to store and organize the data before you bind it to other components. You can also use the DataSet to track changes that you make in UI components. Remember that Flash cant alter external content and requires server interaction for any updates.

The DataSet sends information about the updated data to an XUpdateResolver component in a deltaPacket . The XUpdateResolver processes the deltaPacket and generates an xupdatePacket for use by server-side files.

Like the XMLConnector, the DataSet has no visual appearance, which means you can place it anywhere in your Flash movie. Figure 8-29 shows the icon for the DataSet component.

Figure 8-29: The icon for the DataSet component

Where you need to update data, youll bind the XMLConnector to a DataSet first. Youll then apply two-way bindings from the DataSet to your UI components. The two-way bindings ensure that the DataSet always contains the updated data from the UI components. Youll also need to add other bindings between the DataSet and XUpdateResolver. Ill take you through this process in the next section.

Binding to a DataSet component

To start with, youll need to bind data from an XMLConnector component to a DataSet component. The DataSet will keep track of any changes made by the UI components. If you dont use a DataSet component, you wont be able to track updates to the content.

Youll probably want to select an array from the XMLConnector component properties. This will allow you to bind the data directly to the dataProvider property of the List, ComboBox, and DataGrid. Its much quicker to use data binding than to write ActionScript. Youll set the direction to out so that the data is sent out of the XMLConnector. Finally, youll bind the array to the dataProvider of the DataSet component.

Figure 8-30 shows the Bound To dialog box for a binding from an XMLConnector to a DataSet.

Figure 8-30: Binding to the dataProvider of a DataSet component

Notice that the Schema location section provides a number of different properties that you can use for binding. In addition to the dataProvider , you could bind to the deltaPacket an XML packet describing changes to the data. Youll see this type of binding a little later. You could also bind to the items in the component or to the selectedIndex . The previous exercise showed an example where we bound data to the selectedIndex of a List component.

Next, youll add bindings from the DataSet to your UI components. Select an in/out binding direction so that the components will inform the DataSet of any changes that a user makes. For list-based components, youll need to bind both the dataProvider and selectedIndex properties to synchronize the DataSet and UI component.

You should also create fields in the schema of the DataSet so that the schema matches the exact structure of the results from the XMLConnector component. If you dont do this, the two components wont be identical, and you may have difficulty generating updates later on.

You can add fields in the Schema tab of the Component Inspector. Click the leftmost plus sign to add a component property. Ive shown this in Figure 8-31.

Figure 8-31: Adding a component property to the schema of a DataSet component

You can specify the name of the property and its datatype. The name and datatype should be the same as in the XMLConnector schemathat way, you ensure that the two components contain exactly the same content. This is necessary so that youll be able to update the data correctly.

To capture any changes made to the data, youll need to add an XUpdateResolver component that binds to the DataSet component.

Adding an XUpdateResolver component

An XUpdateResolver component keeps the data in Flash consistent with an external data source. The resolver translates information about changes from a DataSet component into a format that the external data source understands. As with the other data components, the XUpdateResolver has no visual appearance in the finished movie, which means you can position it anywhere. Figure 8-32 shows the XUpdateResolver icon.

Figure 8-32: The XUpdateResolver icon

The relationship between the DataSet and XUpdateResolver components is a little complicated. The DataSet monitors changes from UI components and stores them in a deltaPacket . When youre ready to process these changes, the DataSet sends the deltaPacket to the XUpdateResolver. The resolver converts the deltaPacket into an xupdatePacket that you can send to an XMLConnector. The XMLConnector sends the xupdatePacket to a server-side file where the updates are processed . The server-side file returns an updateResults packet back to the XMLConnector. This packet may contain updated values for UI components. Figure 8-33 shows the process.

Figure 8-33: The update process using a DataSet and XUpdateResolver

The XUpdateResolver uses XUpdate statements to describe changes that youve made to the data. At the time of writing, XUpdate was a Working Draft from the XML: DB Working Group. You can find out more about XUpdate at http://xmldb-org. sourceforge .net/xupdate/.

To make sure that you track all of the changes to your data, youll need to add two bindings, one for the deltaPacket and one for the xupdatePacket . The first binding occurs between the deltaPacket of the DataSet and the deltaPacket of the XUpdateResolver. The deltaPacket is generated by the DataSet component to summarize changes made to the XML content. Youll need to set the direction to out for the DataSet and in for the XUpdateResolver. In other words, the DataSet sends the changes in the deltaPacket to the XUpdateResolver component.

Youll need to add another binding to the XUpdateResolver so that the xupdatePacket is sent out to a second XMLConnector. This XMLConnector sends the xupdatePacket to a server-side file for processing. Figure 8-34 shows the settings for this binding.

Figure 8-34: Binding to the xupdatePacket of a DataSet component

The XMLConnector will also receive an updateResults packet from the server-side file after processing. The server-side page can use the updateResults packet to send additional data to Flash.

One crucial step in the process is setting the encoder for the XUpdateResolver deltaPacket in the Schema tab of the Component Inspector. Youll need to choose the DatasetDeltaToXUpdateDelta encoder and specify the rowNodeKey in the encoder options. The rowNodeKey is an XPath statement that identifies the path to the rows of data. Its a little like the primary key for a database. The XPath statement also contains a predicate that links the path to the relevant data in the DataSet. Check out Chapter 3 to learn more about XPath.

The following code shows the structure of this setting:

 XPathStatement/rowNode[keyFieldName='?DSKeyFieldName' 

The setting includes an XPath expression that identifies the path directly to the row node of the data. The predicate, within square brackets, includes the key field from the schema, an equals sign, and the key field from the DataSet, prefaced by a question mark. The DataSet key field name is usually the same as the schema key field. The text to the right of the equals sign is surrounded by single quotes. When Flash creates the xupdatePacket , it will convert the apostrophes to the entity ' .

Its critical that you write this path correctly; otherwise , you wont be able to generate the correct XUpdate statements in your xupdatePacket .

You need to trigger the DataSet to create the deltaPacket by calling the applyUpdates method. The DataSet then generates the deltaPacket containing the changes to the data. The DataSet sends the deltaPacket to the XUpdateResolver, where the contents are converted into XUpdate statements and added to an xupdatePacket .

The following code shows the structure of an xupdatePacket :

 <?xml version="1.0"?> <xupdate:modifications version="1.0" xmlns:xupdate="http://www.xmldb.org/xupdate">   <xupdate:update select="XPath statement">   Updated value </xupdate:update>   <xupdate:remove select="XPath statement "/>   <xupdate:append select="XPath statement">     <xupdate:element name="parentEName">       <child1Element>Updated value</child1Element>     </xupdate:element>   </xupdate:append> </xupdate:modifications> 

The packet contains three different sections, one each for updates, deletions, and additions to the data. These are the <xupdate:update> , <xupdate:remove> , and <xupdate:append> nodes. You can repeat each of these elements in the xupdatePacket to reflect the multiple additions, updates, or deletions in Flash.

As you can see, things get a lot more complicated when you include DataSet and XUpdateComponents in your Flash movies. Well work through a detailed example so that you can see this process for yourself.