nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Edit related records?

WilsonIonara

I need to be able to edit records in a standalone table, so I want to use related records. I am trying to combine the related records sample with the edit attributes sample. However from what I understand I need to use a link to a featureServer to be able to edit records and the example with the related records uses a link to a mapServer. Is it possible to combine both samples to be able to edit records in the related table or is there a better way to edit related records? Thank you for any help!!!

Here are the links to the samples

https://developers.arcgis.com/en/flex/sample-code/attributetable.htm

https://developers.arcgis.com/en/flex/sample-code/related-records.htm

タグ付けされた投稿をもっと見る

Accepted answers

BenjaminMercier

Yes at the origin, the related table is a "Table" and not a "Layer" that's why in the updateFeatureHandler you can't find the objectIdField, because layerDetails = null.
You should use this :

const objectIdField:String = event.featureLayer.tableDetails.objectIdField;

Don't forget to mark the post as answered if you get your answer 😉

Ben

All comments

WilsonIonara

Hi Ben,

Here is the example with related records and an editable datagrid. Do you think you can help me with the save and delete functions? Thank you so much for all your help!

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
      xmlns:s="library://ns.adobe.com/flex/spark"
      xmlns:mx="library://ns.adobe.com/flex/mx"
      xmlns:esri="http://www.esri.com/2008/ags"
      pageTitle="Related records">
 
 
 <s:layout>
  <s:VerticalLayout gap="0"/>
 </s:layout>
 
 <fx:Script>
  <![CDATA[
   import com.esri.ags.FeatureSet;
   import com.esri.ags.events.FeatureLayerEvent;
   import com.esri.ags.events.MapMouseEvent;
   import com.esri.ags.geometry.Extent;
   import com.esri.ags.tasks.supportClasses.Query;
   import com.esri.ags.tasks.supportClasses.RelationshipQuery;
   
   import mx.controls.Alert;
   import mx.rpc.AsyncResponder;
   
   [Bindable]
   private var selectedObjectID:Number;
   [Bindable]
   private var relatedRecordsCount:Number;
   
   
   
   private function findWells(event:MapMouseEvent):void
   {
    // find wells near the mouse click
    var tol:Number = map.extent.width / map.width * 5;
    var x:Number = event.mapPoint.x;
    var y:Number = event.mapPoint.y;
    var queryExtent:Extent = new Extent(x - tol, y - tol, x + tol, y + tol, event.mapPoint.spatialReference);
    var thisSelectionQuery:Query = new Query();
    thisSelectionQuery.geometry = queryExtent;
    wellsLayer.selectFeatures(thisSelectionQuery, FeatureLayer.SELECTION_NEW);
   }
   
   private function wellsLayer_selectionCompleteHandler(event:FeatureLayerEvent):void
   {
    relatedDatagrid.dataProvider = null;
    // check the first return feature to see if it has any related features
    if (event.features.length > 0)
    {
     relatedTopsQuery.objectIds = [ event.features[0].attributes.OBJECTID ];
     selectedObjectID = event.features[0].attributes.OBJECTID;
     wellsLayer.queryRelatedFeatures(relatedTopsQuery, new AsyncResponder(onResult, onFault));
     function onResult(relatedRecords:Object, token:Object = null):void
     {
      // get related records for the first feature
      var fset:FeatureSet = (relatedRecords[event.features[0].attributes.OBJECTID]);
      if (fset is FeatureSet)
      {
       relatedDatagrid.dataProvider = new ArrayCollection(fset.attributes)
       relatedRecordsCount = fset.attributes.length;
      }
      else
      {
       Alert.show("No related records for well #" + event.features[0].attributes.OBJECTID, "No related records");
       relatedRecordsCount = 0;
      }
     }
     function onFault(info:Object, token:Object = null):void
     {
      map.infoWindow.hide();
      Alert.show(info.toString(), "queryRelatedFeatures Problem");
     }
    }
    else
    {
     map.infoWindow.hide();
     Alert.show("No wells found here, please try somewhere else.", "No features");
    }
   }
   
   protected function saveRelatedRecordsForObjectID(event:MouseEvent):void
   {
    
   }
   
   protected function deleteRelatedRecordsForObjectID(event:MouseEvent):void
   {
    
   }
  ]]>
 </fx:Script>
 
 <fx:Declarations>
  <esri:RelationshipQuery id="relatedTopsQuery"
        outFields="[OBJECTID,API_NUMBER,ELEVATION,FORMATION,TOP]"
        relationshipId="3"/>
 </fx:Declarations>
 
 <s:controlBarLayout>
  <s:VerticalLayout gap="10"
        paddingBottom="7"
        paddingLeft="10"
        paddingRight="10"
        paddingTop="7"/>
 </s:controlBarLayout>
 <s:controlBarContent>
 
  <s:Button click="saveRelatedRecordsForObjectID(event)"
      label="Save"
      visible="{relatedRecordsCount > 0}"/>
  
  <s:Button
   click="deleteRelatedRecordsForObjectID(event)"
   label= "Delete Records"
   visible="{relatedRecordsCount > 0}"/>
  
 </s:controlBarContent>
 
 <esri:Map id="map" mapClick="findWells(event)">
  <esri:extent>
   <esri:Extent xmin="-10854000" ymin="4502000" xmax="-10829000" ymax="4524000">
    <esri:SpatialReference wkid="102100"/>
   </esri:Extent>
  </esri:extent>
  <esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer"/>
  <esri:ArcGISDynamicMapServiceLayer url="http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Petroleum/KSPetro/MapServer">
   <esri:visibleLayers>
    <s:ArrayCollection>
     <fx:Number>0</fx:Number>
     <fx:Number>1</fx:Number>
    </s:ArrayCollection>
   </esri:visibleLayers>
  </esri:ArcGISDynamicMapServiceLayer>
  <esri:FeatureLayer id="wellsLayer"
         mode="selection"
         outFields="[completion,plug_date]"
         selectionComplete="wellsLayer_selectionCompleteHandler(event)"
         url="http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Petroleum/KSPetro/MapServer/0">
   <esri:infoWindowRenderer>
    <fx:Component>
     <esri:LabelDataRenderer>
      <esri:layout>
       <s:VerticalLayout/>
      </esri:layout>
      <esri:label>Well ID {data.OBJECTID}</esri:label>
      <s:Label text="Plug date: {data.plug_date ? new Date(data.plug_date) : 'No date available'}"/>
      <s:Label text="Completion: {data.completion ? new Date(data.completion) : 'No date available'}"/>
     </esri:LabelDataRenderer>
    </fx:Component>
   </esri:infoWindowRenderer>
  </esri:FeatureLayer>
 </esri:Map>
 <s:DataGrid id="relatedDatagrid"
    width="100%" height="45%">
  <s:columns>
   <s:ArrayList>
    <s:GridColumn dataField="OBJECTID" headerText="ID"/>
    <s:GridColumn dataField="API_NUMBER" headerText="API Number"/>
    <s:GridColumn dataField="ELEVATION" headerText="Elevation"/>
    <s:GridColumn dataField="FORMATION" headerText="Formation"/>
    <s:GridColumn dataField="TOP" headerText="Top"/>
   </s:ArrayList>
  </s:columns>
 </s:DataGrid>
 
</s:Application>

WilsonIonara

Ben,

I think I got it, but I would like to know how to the editing in the datagrid so if you can please send me an example, it would be good because I found this way filters the data in the attribute table but it does not let me edit it. Would you happen to know why? It appears that it is not adding it as a feature layer, just as a table although I am casting it as a feature layer. Thanks

Here is how I did:

 <s:TextInput id="qText"
       width="100%"
       enter="doSearch()"
       text="AU"
       toolTip="You may use % as a wildcard, e.g., A%"/>
   <s:Button click="doSearch()" label="Search"/>

and I create the feature when I click the search button and also set the feature layer of the attribute layer

 {
   
   
     var urltable:String = "http://tfsgis-iisd01:6080/arcgis/rest/services/SARS_WILSON/RELATED_TABLES/FeatureServer/1" //or you can use your feature layer layerDetails informations to get the related table Id.
     var yourTable:FeatureLayer; //Here you're casting the table as a FeatureLayer so it's editable
    yourTable = new FeatureLayer(urltable, null, null) as FeatureLayer;
    yourTable.outFields = ["*"];
    yourTable.definitionExpression = "Office like '" + qText.text + "'";
    myAttributeTable.featureLayer = yourTable
   }

WilsonIonara

Benjamin, can you please send me an example and I will start to work on it! Thank you so much!

BenjaminMercier

As I remembered it worked on my layer...

For the datagrid, you could keep the same idea to populate it. Then a datagrid is a flex component which could be editable. If you put it as editable, the dataprovider (so an arrayCollection) will be modified.

For instance, you could add a "Save" button which launch an applyEdits on your featureLayer. You have to convert each lines of the datagrid in an object like "attributes", then push it in an array. Thus you'll use applyEdits like on every other example you could find here.

I'm away for 2 days, but if you want I could give you an example. Perhaps try to populate your DG and make this "Save" button. Send me the code, I'll see that in 2 days.

Good luck

Ben,

WilsonIonara

How can I make it select the record(s)? It is not selecting anything on the table.

I thought about using that example but the problem is that the dataprovider of the data grid is an array with the results of the query and the query is done in a map service and I need to have the attribute table with data linked to a feature layer so I can edit the records. Is it possible to run a query or a definition query on the feature layer (the table)?

BenjaminMercier

Hi,

It's due to the component Attribute Table. It's just selectingin the table the entities answered to the query among all the entities.

If you want to do that, you could develop your own 'attribute table' displaying your data in a flex datagrid. Here is a quick example : https://developers.arcgis.com/en/flex/sample-code/query-result-in-table.htm. But it's highly customizable.

WilsonIonara

Hi Benjamin,

A quick question: I am using a feature layer from my server so I know the records are related. Is the selection complete handler supposed to show only the records that are related to that point? Because I changed the function to use my own data but nothing changes in the table when I click the point. All records are being displayed on the table. Is it possible to change the function to make that work? Thank you!!!

 protected function myFeatureLayer_SelectionCompleteHandler(event:FeatureLayerEvent):void
   {
    var query:Query = new Query;
    query.where = "Office = " + myFeatureLayer.selectedFeatures[0].attributes.NAME_SH;
    
    yourTable.selectFeatures(query, FeatureLayer.SELECTION_NEW);
     
    
    
   }

WilsonIonara

Cool, it worked, thank you so much for your help and expertise!!!

BenjaminMercier

Yes at the origin, the related table is a "Table" and not a "Layer" that's why in the updateFeatureHandler you can't find the objectIdField, because layerDetails = null.
You should use this :

const objectIdField:String = event.featureLayer.tableDetails.objectIdField;

Don't forget to mark the post as answered if you get your answer 😉

Ben

WilsonIonara

yes, I will definitelly need to mark the question as answered. You've been of great help. However, the table is not saving the updates even with the code. It should know which feature layer to update since the event is in the myAttributeTable and the the feature layer for that is "yourTable", right? But it is not being saved. I will start a new thread with this question. Thank you so much again!

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:s="library://ns.adobe.com/flex/spark"
    xmlns:esri="http://www.esri.com/2008/ags"
    pageTitle="Attribute Table">    
  
  
  <s:layout>
   <s:VerticalLayout gap="0"/>
  </s:layout>
  
  <fx:Script>
   <![CDATA[
    import com.esri.ags.Graphic;
    import com.esri.ags.events.AttributeTableEvent;
    import com.esri.ags.events.FeatureLayerEvent;
    import com.esri.ags.layers.supportClasses.FeatureEditResult;
    import com.esri.ags.layers.supportClasses.FeatureEditResults;
    import com.esri.ags.layers.supportClasses.Field;
    import com.esri.ags.tasks.supportClasses.Query;
    
    import mx.controls.Alert;
    import mx.events.FlexEvent;
    import mx.rpc.AsyncResponder;
    import mx.rpc.Fault;
    
    /* [Bindable] 
    private var urltable:String = "http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/SanFrancisco/311Incidents/MapServer/1" //or you can use your feature layer layerDetails informations to get the related table Id.
    private var yourTable:FeatureLayer; //Here you're casting the table as a FeatureLayer so it's editable
    
    protected function application1_initializeHandler(event:FlexEvent):void
    {
    yourTable = new FeatureLayer(urltable, null, null) as FeatureLayer;
    }*/
    protected function myMap_clickHandler(event:MouseEvent):void
    {
     if (event.target is Graphic || event.target.parent is Graphic)                
     {                    
      var graphic:Graphic = event.target is Graphic ? Graphic(event.target) : Graphic(event.target.parent);
      var query:Query = new Query;
      query.objectIds = [graphic.attributes[myFeatureLayer.layerDetails.objectIdField]];
      myFeatureLayer.selectFeatures(query, FeatureLayer.SELECTION_NEW);
      myFeatureLayer.addEventListener(FeatureLayerEvent.SELECTION_COMPLETE,myFeatureLayer_SelectionCompleteHandler);
     }
     else
     {
      myFeatureLayer.clearSelection();
      yourTable.clearSelection();
     }
    }
    
    protected function myFeatureLayer_SelectionCompleteHandler(event:FeatureLayerEvent):void
    {
     var query:Query = new Query;
     query.where = "sf_311_serviceoid  = " + myFeatureLayer.selectedFeatures[0].attributes.objectid;
     yourTable.selectFeatures(query, FeatureLayer.SELECTION_NEW);
    }
    
    protected function fdg_updateFeatureHandler(event:AttributeTableEvent):void
    {
     const attributes:Object = {};
     const objectIdField:String = event.featureLayer.layerDetails.objectIdField;
     attributes[objectIdField] = event.feature.attributes[objectIdField];
     attributes[event.field.name] = event.newValue;
     
     // change the attributes on client right away
     event.feature.attributes[event.field.name] = event.newValue;
     
     const feature:Graphic = new Graphic(null, null, attributes);
     const updates:Array = [ feature ];
     event.featureLayer.applyEdits(null, updates, null, false,
      new AsyncResponder(featureLayer_editsCompleteHandler, featureLayer_faultHandler,
       { feature: event.feature, field: event.field, oldValue: event.oldValue }));
    }
    
    protected function fdg_deleteFeaturesHandler(event:AttributeTableEvent):void
    {
     const deletes:Array = event.features;
     event.featureLayer.applyEdits(null, null, deletes, false,
      new AsyncResponder(featureLayer_editsCompleteHandler, featureLayer_faultHandler));
    }
    
    private function featureLayer_editsCompleteHandler(featureEditResults:FeatureEditResults, token:Object = null):void
    {
     var doRefresh:Boolean = false;
     
     for each (var deleteResult:FeatureEditResult in featureEditResults.deleteResults)
     {
      if (deleteResult.success === false)
      {
       Alert.show("Could not delete feature");
       doRefresh = true;
      }
     }
     
     for each (var updateResult:FeatureEditResult in featureEditResults.updateResults)
     {
      const feature:Graphic = token.feature;
      if (updateResult.success === false)
      {
       Alert.show("Could not update feature, Restoring old value", "Error");
       
       const field:Field = token.field;
       feature.attributes[field.name] = token.oldValue;
       doRefresh = true;
      }
      else
      {
       feature.refresh();
      }
     }
     
     if (doRefresh)
     {
      myAttributeTable.refresh();
     }
    }
    
    private function featureLayer_faultHandler(fault:Fault, token:Object = null):void
    {
     Alert.show(fault.faultString, "Fault");
     myAttributeTable.refresh();
    }
    
    
   ]]>    
   
   
  </fx:Script>
  
  <fx:Declarations>
   
   <esri:FeatureLayer id="yourTable" outFields="*" url="http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/SanFrancisco/311Incidents/FeatureServer/1"/>    
  </fx:Declarations>            
  
  <s:controlBarContent>        
   <s:RichText width="100%">
    This sample demonstrates how to use the AttributeTable component which allows viewing and editing feature atttributes.
    The component uses a data grid where the columns correspond to the fields of a feature layer.
    The application also allows user to click on a feature and select it. The AttributeTable then displays the selection
    by highlighting the corresponding row in the grid.
    
   </s:RichText>    
  </s:controlBarContent>
  <esri:Map id="myMap"
   width="100%" height="60%"
   click="myMap_clickHandler(event)">        
   <esri:extent>            
    <esri:Extent id="sheepfire" xmin="-13638587" ymin="4543797" xmax="-13620242" ymax="4549912">                
     <esri:SpatialReference wkid="102100"/>            
    </esri:Extent>        
   </esri:extent>        
   <esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer"/>        
   <esri:FeatureLayer id="myFeatureLayer" mode="onDemand" outFields="*" url="http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/SanFrancisco/311Incidents/FeatureServer/0"/>    
   
  </esri:Map>
  <s:Line width="100%">        
   <s:stroke>            
    <s:SolidColorStroke color="0x000000" weight="1"/>        
   </s:stroke>    
  </s:Line>
  <s:BorderContainer width="100%" height="40%"
      backgroundColor="0xEEEEEE"
      borderVisible="false">        
   <s:layout>            
    <s:HorizontalLayout paddingLeft="5" paddingRight="5" paddingTop="2"/>        
   </s:layout>        
   <esri:AttributeTable 
    id="myAttributeTable"
    width="100%" height="100%"
    deleteFeatures="fdg_deleteFeaturesHandler(event)"
    featureLayer="{yourTable}"
    updateFeature="fdg_updateFeatureHandler(event)">            
   </esri:AttributeTable>    
  </s:BorderContainer>
            
</s:Application>

BenjaminMercier

Yes I add the function to do that. You have to fill them.

Substitute the //TODO commentary by the code to do that. I didn't give a look to this code but I guess it should be really close to the one in the attributeTable sample except that you should applyEdits on yourTable and not on myFeatureLayer.

I'm glad that I can help you.
Don't forget to mark the post as "Answered" if you get your answer.

Thanks,

Ben

WilsonIonara

This is great Benjamin. Thank you so much. Do you know why the changes are not being saved (displayed on the table)?

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:s="library://ns.adobe.com/flex/spark"
    xmlns:esri="http://www.esri.com/2008/ags"
    pageTitle="Attribute Table">    
  
  
  <s:layout>
   <s:VerticalLayout gap="0"/>
  </s:layout>
  
  <fx:Script>
   <![CDATA[
    import com.esri.ags.Graphic;
    import com.esri.ags.events.AttributeTableEvent;
    import com.esri.ags.events.FeatureLayerEvent;
    import com.esri.ags.layers.supportClasses.FeatureEditResult;
    import com.esri.ags.layers.supportClasses.FeatureEditResults;
    import com.esri.ags.layers.supportClasses.Field;
    import com.esri.ags.tasks.supportClasses.Query;
    
    import mx.controls.Alert;
    import mx.events.FlexEvent;
    import mx.rpc.AsyncResponder;
    import mx.rpc.Fault;
    
    /* [Bindable] 
    private var urltable:String = "http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/SanFrancisco/311Incidents/MapServer/1" //or you can use your feature layer layerDetails informations to get the related table Id.
    private var yourTable:FeatureLayer; //Here you're casting the table as a FeatureLayer so it's editable
    
    protected function application1_initializeHandler(event:FlexEvent):void
    {
    yourTable = new FeatureLayer(urltable, null, null) as FeatureLayer;
    }*/
    protected function myMap_clickHandler(event:MouseEvent):void
    {
     if (event.target is Graphic || event.target.parent is Graphic)                
     {                    
      var graphic:Graphic = event.target is Graphic ? Graphic(event.target) : Graphic(event.target.parent);
      var query:Query = new Query;
      query.objectIds = [graphic.attributes[myFeatureLayer.layerDetails.objectIdField]];
      myFeatureLayer.selectFeatures(query, FeatureLayer.SELECTION_NEW);
      myFeatureLayer.addEventListener(FeatureLayerEvent.SELECTION_COMPLETE,myFeatureLayer_SelectionCompleteHandler);
     }
     else
     {
      myFeatureLayer.clearSelection();
      yourTable.clearSelection();
     }
    }
    
    protected function myFeatureLayer_SelectionCompleteHandler(event:FeatureLayerEvent):void
    {
     var query:Query = new Query;
     query.where = "sf_311_serviceoid  = " + myFeatureLayer.selectedFeatures[0].attributes.objectid;
     yourTable.selectFeatures(query, FeatureLayer.SELECTION_NEW);
    }
    
    protected function fdg_updateFeatureHandler(event:AttributeTableEvent):void
    {
     const attributes:Object = {};
     const objectIdField:String = event.featureLayer.layerDetails.objectIdField;
     attributes[objectIdField] = event.feature.attributes[objectIdField];
     attributes[event.field.name] = event.newValue;
     
     // change the attributes on client right away
     event.feature.attributes[event.field.name] = event.newValue;
     
     const feature:Graphic = new Graphic(null, null, attributes);
     const updates:Array = [ feature ];
     event.featureLayer.applyEdits(null, updates, null, false,
      new AsyncResponder(featureLayer_editsCompleteHandler, featureLayer_faultHandler,
       { feature: event.feature, field: event.field, oldValue: event.oldValue }));
    }
    
    protected function fdg_deleteFeaturesHandler(event:AttributeTableEvent):void
    {
     const deletes:Array = event.features;
     event.featureLayer.applyEdits(null, null, deletes, false,
      new AsyncResponder(featureLayer_editsCompleteHandler, featureLayer_faultHandler));
    }
    
    private function featureLayer_editsCompleteHandler(featureEditResults:FeatureEditResults, token:Object = null):void
    {
     var doRefresh:Boolean = false;
     
     for each (var deleteResult:FeatureEditResult in featureEditResults.deleteResults)
     {
      if (deleteResult.success === false)
      {
       Alert.show("Could not delete feature");
       doRefresh = true;
      }
     }
     
     for each (var updateResult:FeatureEditResult in featureEditResults.updateResults)
     {
      const feature:Graphic = token.feature;
      if (updateResult.success === false)
      {
       Alert.show("Could not update feature, Restoring old value", "Error");
       
       const field:Field = token.field;
       feature.attributes[field.name] = token.oldValue;
       doRefresh = true;
      }
      else
      {
       feature.refresh();
      }
     }
     
     if (doRefresh)
     {
      myAttributeTable.refresh();
     }
    }
    
    private function featureLayer_faultHandler(fault:Fault, token:Object = null):void
    {
     Alert.show(fault.faultString, "Fault");
     myAttributeTable.refresh();
    }
    
    
   ]]>    
   
   
  </fx:Script>
  
  <fx:Declarations>
   
   <esri:FeatureLayer id="yourTable" outFields="*" url="http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/SanFrancisco/311Incidents/FeatureServer/1"/>    
  </fx:Declarations>            
  
  <s:controlBarContent>        
   <s:RichText width="100%">
    This sample demonstrates how to use the AttributeTable component which allows viewing and editing feature atttributes.
    The component uses a data grid where the columns correspond to the fields of a feature layer.
    The application also allows user to click on a feature and select it. The AttributeTable then displays the selection
    by highlighting the corresponding row in the grid.
    
   </s:RichText>    
  </s:controlBarContent>
  <esri:Map id="myMap"
   width="100%" height="60%"
   click="myMap_clickHandler(event)">        
   <esri:extent>            
    <esri:Extent id="sheepfire" xmin="-13638587" ymin="4543797" xmax="-13620242" ymax="4549912">                
     <esri:SpatialReference wkid="102100"/>            
    </esri:Extent>        
   </esri:extent>        
   <esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer"/>        
   <esri:FeatureLayer id="myFeatureLayer" mode="onDemand" outFields="*" url="http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/SanFrancisco/311Incidents/FeatureServer/0"/>    
   
  </esri:Map>
  <s:Line width="100%">        
   <s:stroke>            
    <s:SolidColorStroke color="0x000000" weight="1"/>        
   </s:stroke>    
  </s:Line>
  <s:BorderContainer width="100%" height="40%"
      backgroundColor="0xEEEEEE"
      borderVisible="false">        
   <s:layout>            
    <s:HorizontalLayout paddingLeft="5" paddingRight="5" paddingTop="2"/>        
   </s:layout>        
   <esri:AttributeTable 
    id="myAttributeTable"
    width="100%" height="100%"
    deleteFeatures="fdg_deleteFeaturesHandler(event)"
    featureLayer="{yourTable}"
    updateFeature="fdg_updateFeatureHandler(event)">            
   </esri:AttributeTable>    
  </s:BorderContainer>
            
</s:Application>

BenjaminMercier

Hi,

1 - If you want to edit it, you should use FeatureServer link
2 - If you want you can use AttributeTable. Just put your "yourTable" between <fx:Declarations> :

<fx:Declarations>
 <esri:FeatureLayer id="yourTable" outFields="*" url="http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/SanFrancisco/311Incidents/FeatureServer/1"/>    
</fx:Declarations>

3 - Here : http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/SanFrancisco/311Incidents/FeatureServer/1,
look at the fields, Objectid is the primary key of the related table, sf_311_serviceoid is the foreign key equal to the incidents table objectid

4 - I add some code which select the row in attribute table if there are some rows related to the incidents entity you clicked on the map.

Take a look at the code

<?xml version="1.0" encoding="utf-8"?><s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:s="library://ns.adobe.com/flex/spark"
    xmlns:esri="http://www.esri.com/2008/ags"
    pageTitle="Attribute Table">    
            

  <s:layout>
   <s:VerticalLayout gap="0"/>
  </s:layout>
            
  <fx:Script>
   <![CDATA[
   import com.esri.ags.Graphic;
   import com.esri.ags.events.AttributeTableEvent;
   import com.esri.ags.events.FeatureLayerEvent;
   import com.esri.ags.layers.supportClasses.FeatureEditResult;
   import com.esri.ags.layers.supportClasses.FeatureEditResults;
   import com.esri.ags.layers.supportClasses.Field;
   import com.esri.ags.tasks.supportClasses.Query;
   
   import mx.controls.Alert;
   import mx.events.FlexEvent;
   import mx.rpc.AsyncResponder;
   import mx.rpc.Fault;
   
  /* [Bindable] 
   private var urltable:String = "http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/SanFrancisco/311Incidents/MapServer/1" //or you can use your feature layer layerDetails informations to get the related table Id.
   private var yourTable:FeatureLayer; //Here you're casting the table as a FeatureLayer so it's editable
   
   protected function application1_initializeHandler(event:FlexEvent):void
   {
    yourTable = new FeatureLayer(urltable, null, null) as FeatureLayer;
   }*/
   protected function myMap_clickHandler(event:MouseEvent):void
   {
    if (event.target is Graphic || event.target.parent is Graphic)                
    {                    
     var graphic:Graphic = event.target is Graphic ? Graphic(event.target) : Graphic(event.target.parent);
       var query:Query = new Query;
            query.objectIds = [graphic.attributes[myFeatureLayer.layerDetails.objectIdField]];
     myFeatureLayer.selectFeatures(query, FeatureLayer.SELECTION_NEW);
     myFeatureLayer.addEventListener(FeatureLayerEvent.SELECTION_COMPLETE,myFeatureLayer_SelectionCompleteHandler);
      }
    else
    {
     myFeatureLayer.clearSelection();
     yourTable.clearSelection();
      }
   }
   
   protected function myFeatureLayer_SelectionCompleteHandler(event:FeatureLayerEvent):void
   {
    var query:Query = new Query;
    query.where = "sf_311_serviceoid  = " + myFeatureLayer.selectedFeatures[0].attributes.objectid;
    yourTable.selectFeatures(query, FeatureLayer.SELECTION_NEW);
   }
   
   protected function fdg_updateFeatureHandler(event:AttributeTableEvent):void
   {
   //TODO
   }
   
   protected function fdg_deleteFeaturesHandler(event:AttributeTableEvent):void
   {                
    //TODO
   }
   
   private function featureLayer_editsCompleteHandler(featureEditResults:FeatureEditResults, token:Object = null):void            
   {               
            //TODO
   }
   
   private function featureLayer_faultHandler(fault:Fault, token:Object = null):void
   {                
    Alert.show(fault.faultString, "Fault");
    myAttributeTable.refresh();
   }        
   

  ]]>    
   

</fx:Script>

<fx:Declarations>
 
 <esri:FeatureLayer id="yourTable" outFields="*" url="http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/SanFrancisco/311Incidents/FeatureServer/1"/>    
</fx:Declarations>            
            
  <s:controlBarContent>        
   <s:RichText width="100%">
    This sample demonstrates how to use the AttributeTable component which allows viewing and editing feature atttributes.
     The component uses a data grid where the columns correspond to the fields of a feature layer.
     The application also allows user to click on a feature and select it. The AttributeTable then displays the selection
     by highlighting the corresponding row in the grid.
          
   </s:RichText>    
  </s:controlBarContent>
  <esri:Map id="myMap"
   width="100%" height="60%"
   click="myMap_clickHandler(event)">        
   <esri:extent>            
    <esri:Extent id="sheepfire" xmin="-13638587" ymin="4543797" xmax="-13620242" ymax="4549912">                
     <esri:SpatialReference wkid="102100"/>            
    </esri:Extent>        
   </esri:extent>        
   <esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer"/>        
   <esri:FeatureLayer id="myFeatureLayer" mode="onDemand" outFields="*" url="http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/SanFrancisco/311Incidents/FeatureServer/0"/>    
       
  </esri:Map>
  <s:Line width="100%">        
   <s:stroke>            
    <s:SolidColorStroke color="0x000000" weight="1"/>        
   </s:stroke>    
  </s:Line>
  <s:BorderContainer width="100%" height="40%"
      backgroundColor="0xEEEEEE"
      borderVisible="false">        
   <s:layout>            
    <s:HorizontalLayout paddingLeft="5" paddingRight="5" paddingTop="2"/>        
   </s:layout>        
   <esri:AttributeTable 
    id="myAttributeTable"
    width="100%" height="100%"
    deleteFeatures="fdg_deleteFeaturesHandler(event)"
    featureLayer="{yourTable}"
    updateFeature="fdg_updateFeatureHandler(event)">            
   </esri:AttributeTable>    
  </s:BorderContainer>
           
 </s:Application>

WilsonIonara

Thank you so much for your help Benjamin. I am trying to figure this out and will come back with a few questions. Thank you!

BenjaminMercier

Hi Ionara,

If you really want to use the Attribute table to edit related table in a non spatial table here is some things you could do:
You could cast your standalon table as a Feature Layer:

var url:String = "theURLpathToYourStandaloneTable" //or you can use your feature layer layerDetails informations to get the related table Id.
var yourTable:FeatureLayer = new FeatureLayer(url, null, null) as FeatureLayer ; //Here you're casting the table as a FeatureLayer so it's editable

Then you can use the attribute table sample on the "yourTable" feature layer. In the query you should add a "where clauses" to link the displayed feature layer with the attribute table as :

query.where = "yourTable_displayFeatureLayerID = yourDisplayedFeatureLayerID";

where yourTable_displayFeatureLayerID is the foreign key in your standalone table.

If you don't have yet this foreign key, don't forget to make a relationship when you are publishing your service.

Hope this help,
Ben

会話に参加する

サインインしたメンバーは投稿、更新のフォローなどができます。初めてですか？無料アカウントを登録してください。

クイックリンク

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.