Using An XMLListCollection As A Data Provider and Sorting An XMLListCollection in Flex 2

Introduction:

Many of the Flex controls can use XML data as the data provider to provide the values shown by the control. If you want to dynamically add data to the XML being used as the data provider then you should use an XMLListCollection object as the data provider. You can also sort the XMLListCollection to show the values in either ascending or descending order.

Discussion:

Class XMLListCollection provides methods to add additional XML data. If you've set the Flex controls dataProvider attribute to the XMLListCollection object then after you've added additional XML data to the XMLListCollection, your control will show the new data automatically.

Class XMLListCollection includes the ability to sort the XML data. So if initially the XML data you receive from a web service is not sorted, you can sort the XMLListCollection and then display the sorted data in your Flex control.

I've created an example of using class XMLListCollection as the data provider for the Flex list control. See:
http://www.brucephillips.name/flex/xmllistcollectionexample/XMLListCollectionExample.html
You can right click on the example application to view the source code. I've included extensive comments in the source code to explain how to create an XMLListCollection object and how to sort the XMLListCollection object.

Below is the code I used in my example to create the XMLListCollection.



/*create the carCompanies XML object
using an XML literal
see page 319 in Programming ActionScript 3.0
*/

carCompanies =
<companies>
<company>Toyota</company>
<company>Nissan</company>
<company>Ford</company>
</companies>;

/*
create an XMLList object that will have
all the company elements (don't use the root node)
*/

carCompaniesList = carCompanies.company;

//create an XMLListCollection object using the XMLList object

carCompaniesListCol = new XMLListCollection(carCompaniesList);

A note about sorting an XMLListCollection. It took me awhile to figure out how to sort my XMLListCollection. I finally found a brief note on this web page:
http://livedocs.adobe.com/flex/2/langref/mx/collections/Sort.html
that states (read the paragraph near the top that starts "There are situations in which ...") if there is only one field in the collection then you must use null as the first argument to the SortField constructor.

Below is the code I used in my example to sort the XMLListCollection



//Create the Sort object
    sortA = new Sort();
    
     /*
     since there is only one element (company) in our XMLListCollection
     we must use null for the first argument to the SortField constructor
     this will cause the SortField to use the company element for sorting
     see: http://livedocs.adobe.com/flex/2/langref/mx/collections/Sort.html
     */

    sortA.fields= [new SortField(null, true)];
    
     /*
     set the sort property of our XMLListCollection to the
     sort object we just created
     */

                
    carCompaniesListCol.sort=sortA;
    
    //must call refresh to apply the sort

    carCompaniesListCol.refresh();


If you run the example application you'll see that when the application first loads, the XMLListCollection is sorted correctly even though initially the XML object's company elements were not in alphabetical order. When you enter a new car company in the text input box and click on the button, that car company is added to the XMLListCollection, the sort is redone, and the list of car companies then includes the new car company and remains in sorted order.

References:

Chapter 11, Working With XML, Programming ActionScript 3.0

Class XMLList, Flex 2 Language Reference

Class XMLListCollection, Flex 2 Language Reference

Using Data Providers and Collections, Flex 2 Developer's Guide

Class Sort, Flex 2 Language Reference

Comments (Comment Moderation is enabled. Your comment will not appear until approved.)
Thanks bruce, was of much help!
# Posted By Sri | 7/30/07 12:17 AM
Hi Bruce,..
If my xmllist is of the form
<item name="DDD" age="13"/>
<item name="BBB" age="12"/>
<item name="CCC" age="11"/>

and that is bound to a datagrid,...
Then how can the sorting be incorporated in this case, if the user clicks the header?
# Posted By Shameer Salim | 7/16/08 6:15 AM
BlogCFC was created by Raymond Camden. This blog is running version 5.9.1.002. Contact Blog Owner