Flex API For ArcGIS Server in action

This is one of my favorite usage of the API in pure MXML. I'm taking advantage of data binding to represent the output of a Query Task in graphical and textural format. In this application, I've created a QueryTask to a specific layer (countries) in an ArcGIS service (world). The QueryTask has a Query child specifying that the geomerty of the features should be returned, in addition to all the attribute fields. The application UI consists of a side by side map and data grid, and below those is a text field to define a "where" clause, and a button to execute the query. The map has two layers, a dynamic layer to show the world and a graphic layer to show the selected countries. When a user clicks the Query button, the Query "where" attribute is populated (via binding) with the textfield content and the QueryTask is executed. Upon a successful result, the graphic layer will be populated with new graphic objects and the data grid will contain new rows.

The binding "magic" is in the following two lines:

graphicProvider="{queryTask.executeLastResult.features}"

dataProvider="{queryTask.executeLastResult.attributes}"

where the graphic layer will be populated with the query task last result features, and the data grid will be populated with the query task last result attributes. Pretty cool, eh ? And the best part...no ActionScript :-)

<?xml version="1.0" encoding="utf-8"?>
<mx:Application
  xmlns:mx="http://www.adobe.com/2006/mxml"
  xmlns:esri="http://www.esri.com/2008/ags"
  xmlns:sample="com.esri.ags.sample.*"
  layout="absolute"  
  >
  <esri:QueryTask id="queryTask" url="http://tejas:8399/arcgis/rest/services/maps/world/MapServer/1">
    <esri:Query id="query" returnGeometry="true" where="{where.text}">
        <esri:outFields>
            <mx:String>*</mx:String>
        </esri:outFields>
    </esri:Query>
  </esri:QueryTask>
  <mx:Panel width="100%" height="100%">
    <mx:HBox width="100%" height="100%" horizontalGap="0">
      <esri:Map id="map">
        <esri:ArcGISDynamicMapServiceLayer        
          url="http://tejas:8399/arcgis/rest/services/maps/world/MapServer"/>
        <esri:GraphicsLayer id="graphicsLayer"
            graphicProvider="{queryTask.executeLastResult.features}">
            <esri:symbol>
                <esri:SimpleFillSymbol color="0xFF0000"/>
            </esri:symbol>
        </esri:GraphicsLayer>
      </esri:Map>
      <mx:DataGrid width="100%" height="100%"
          dataProvider="{queryTask.executeLastResult.attributes}">
          <mx:columns>
              <mx:DataGridColumn headerText="Name" dataField="NAME"/>
              <mx:DataGridColumn headerText="FIPS" dataField="FIPS_CODE"/>
              <mx:DataGridColumn headerText="Area" dataField="AREA"/>
          </mx:columns>
      </mx:DataGrid>
    </mx:HBox>
    <mx:ControlBar>
      <mx:TextInput id="where" text="FID < 10"/>
      <mx:Button label="Query" click="queryTask.execute()"/>
    </mx:ControlBar>    
  </mx:Panel>
</mx:Application>