Combine 2 dataGrids into one with states

<mx:DataGrid id="grid" width="100%" height="100%" sortableColumns="true"
             itemClick.ordersState="{_selectedOrder=grid.selectedItem.ordersState}"
             selectable.ordersState="true" includeIn="locationsState, ordersState" >
    <mx:columns >
        <mx:DataGridColumn dataField="name" headerText="Name" includeIn="locationsState"/> ->ex Location grid
        <mx:DataGridColumn dataField="locationTypeName" headerText="Type" includeIn="locationsState" /> ->ex Location grid
        <mx:DataGridColumn dataField="uid" headerText="Number" includeIn="ordersState" /> ->ex Orders grid
        <mx:DataGridColumn headerText="Order #" dataField="orderId" includeIn="ordersState"/> ->ex Orders grid
        <mx:DataGridColumn headerText="Status" dataField="orderStatus" includeIn="ordersState"/> ->ex Orders grid
        <mx:DataGridColumn dataField="customerName" headerText="Customer" includeIn="ordersState" /> ->ex Orders grid
    </mx:columns>
</mx:DataGrid>

and changed providers like this

private function _ws_result_order(e:ResultEvent):void
{
  grid.dataProvider.ordersState = e.result;
}

private function _ws_result(e:ResultEvent):void
{
  grid.dataProvider.locationsState = e.result;
}

I get an error:

The children of Halo navigators must implement INavigatorContent. ReceiveIn.mxml /work/src/ui/fragments line 332 Flex Problem

Sounds like you've used a viewstack or tabNavigator.

In that case, you need to do one of the following:

<ViewStack>
     <Canvas>
         <DataGrid />
     </Canvas>
</Viewtack>

(ie., wrap your dataGrid inside a Canvas)

or

<Viewstack>
     <NavigatorContent>
          <Group>
              <DataGrid />
          </Group>
      </NavigatorContent>
 </Viewstack>

(ie., wrap your DataGrid in a group, and the group inside a NavigatorContent tag.)

Note - the approach is the same with a tab navigator.