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; } } }

edits-complete event of feature layer is not firing after moving a feature

AzizaParveen2

ArcGIS JavaScript API issue, I am developing a web editing application and if I move any feature, edits-complete event of feature
layer does not fire, I need to run a function feature move/update completes. Is it a bug or I am missing something here, if you guys know any work around or having same issue please let me know.

Thanks

Aziza

Find more posts tagged with

Accepted answers

RRubalcava

Check out this sample.

When you are done moving the vertices, you need to deactivate the toolbar. You'll need to wire up when this happens, in this case the sample deactivates the toolbar on a dbl-click and then applies the edits to the FeatureLayer.

function initEditing(evt) {
  var firePerimeterFL = map.getLayer("firePerimeterFL");
  var editToolbar = new Edit(map);
  editToolbar.on("deactivate", function(evt) {
    if ( evt.info.isModified ) {
      firePerimeterFL.applyEdits(null, [evt.graphic], null);
    }
  });
  var editingEnabled = false;
  firePerimeterFL.on("dbl-click", function(evt) {
    event.stop(evt);
    if (editingEnabled === false) {
      editingEnabled = true;
      editToolbar.activate(Edit.EDIT_VERTICES , evt.graphic);
    } else {
      editToolbar.deactivate();
      editingEnabled = false;
    }
  });
}

Hope that helps.

All comments

AzizaParveen2

Jake the sample didn’t work for me, since I was using editor widget, all I needed was to deactivate the toolbar,. Thanks so much for your time.

image001.jpg

AzizaParveen2

Thanks so much Rene, I got it to work from your suggestion, I was using editor widget instead of coding for editing, editor toolbar activates when you single click on a feature and deactivates when any feature gets unselected or you click any place on the map other than features and then edits-completes fires..thanks so much for pointing me to the right direction.

Regards

Aziza

image001.jpg

RRubalcava

Check out this sample.

function initEditing(evt) {
  var firePerimeterFL = map.getLayer("firePerimeterFL");
  var editToolbar = new Edit(map);
  editToolbar.on("deactivate", function(evt) {
    if ( evt.info.isModified ) {
      firePerimeterFL.applyEdits(null, [evt.graphic], null);
    }
  });
  var editingEnabled = false;
  firePerimeterFL.on("dbl-click", function(evt) {
    event.stop(evt);
    if (editingEnabled === false) {
      editingEnabled = true;
      editToolbar.activate(Edit.EDIT_VERTICES , evt.graphic);
    } else {
      editToolbar.deactivate();
      editingEnabled = false;
    }
  });
}

Hope that helps.

AzizaParveen2

Thanks so much Jake, I will try it and let you know☺

image001.jpg

AzizaParveen2

Hi Rene, Thank you so much for your response. I am not using applyEdits since I am using editor widget.

Yes I am using the toolbar but it also happens if I just click on the feature and move it. This event firs just fine if I add a new feature or delete one. Here is the sample code

Hydrants.on("edits-complete", refreshLayer);

CPN.on("edits-complete", refreshLayer);

Street.on("edits-complete", refreshLayer);

refreshLayer = function () {

webEditedLayers.refresh();

CPN.refresh();

Hydrants.refresh();

Street.refresh();

}

If it only works when using applyEdits, then is there any other event fire after moving a feature?

Thanks and I really appreciate your help.

jskinner

Hi Aziza,

This should work. Below is a modified sample that writes the array of results returned from the edits-complete event after the waterbodies feature layer is edited.

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <!--The viewport meta tag is used to improve the presentation and behavior of the samples 
      on iOS devices-->
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
    <title>Edit rivers and waterbodies</title>

    <link rel="stylesheet" href="http://js.arcgis.com/3.12/dijit/themes/claro/claro.css">
    <link rel="stylesheet" href="http://js.arcgis.com/3.12/esri/css/esri.css" />
    <style>
      html,body{height:100%;width:100%;margin:0;overflow:hidden;}
      #map{
        padding:0;
      }
      #header{
        font-size: 1.1em;
        font-family: sans-serif;
        padding-left: 1em;
        padding-top:4px;
        color:#660000;
      }
      .templatePicker {
        border: none;
      }

      .dj_ie .infowindow .window .top .right .user .content { position: relative; }
      .dj_ie .simpleInfoWindow .content {position: relative;}
    </style>
    
    <script src="http://js.arcgis.com/3.12/"></script>
    <script>
      var map;
      
      require([
        "esri/map", 
        "esri/tasks/GeometryService",
        "esri/toolbars/edit",

        "esri/layers/ArcGISTiledMapServiceLayer",
        "esri/layers/FeatureLayer",

        "esri/Color",
        "esri/symbols/SimpleMarkerSymbol",
        "esri/symbols/SimpleLineSymbol",

        "esri/dijit/editing/Editor",
        "esri/dijit/editing/TemplatePicker",

        "esri/config",
        "dojo/i18n!esri/nls/jsapi",

        "dojo/_base/array", "dojo/parser", "dojo/keys",

        "dijit/layout/BorderContainer", "dijit/layout/ContentPane", 
        "dojo/domReady!"
      ], function(
        Map, GeometryService, Edit, 
        ArcGISTiledMapServiceLayer, FeatureLayer,
        Color, SimpleMarkerSymbol, SimpleLineSymbol, 
        Editor, TemplatePicker,
        esriConfig, jsapiBundle,
        arrayUtils, parser, keys
      ) {
        parser.parse();       

        // snapping is enabled for this sample - change the tooltip to reflect this
        jsapiBundle.toolbars.draw.start = jsapiBundle.toolbars.draw.start +  "<br>Press <b>ALT</b> to enable snapping";
       
        // refer to "Using the Proxy Page" for more information:  https://developers.arcgis.com/javascript/jshelp/ags_proxy.html
        esriConfig.defaults.io.proxyUrl = "/proxy/";    

        //This service is for development and testing purposes only. We recommend that you create your own geometry service for use within your applications. 
        esriConfig.defaults.geometryService = new GeometryService("http://tasks.arcgisonline.com/ArcGIS/rest/services/Geometry/GeometryServer");
        
        map = new Map("map", { 
          basemap: "satellite",
          center: [-96.541, 38.351],
          zoom: 14,
          slider: false 
        });

        map.on("layers-add-result", initEditor);
       
        //add boundaries and place names 
        var labels = new ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/Reference/World_Boundaries_and_Places/MapServer");
        map.addLayer(labels);

        var rivers = new FeatureLayer("http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Hydrography/Watershed173811/FeatureServer/1",{
          mode: FeatureLayer.MODE_ONDEMAND, 
          outFields: ['*']
        });

        var waterbodies = new FeatureLayer("http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Hydrography/Watershed173811/FeatureServer/0",{
          mode: FeatureLayer.MODE_ONDEMAND, 
          outFields: ['*']
        });

        map.addLayers([waterbodies,rivers]);
        
        waterbodies.on("edits-complete", function(results){
          console.log(results);
        })

        function initEditor(evt) {
          var templateLayers = arrayUtils.map(evt.layers, function(result){
            return result.layer;
          });
          var templatePicker = new TemplatePicker({
            featureLayers: templateLayers,
            grouping: true,
            rows: "auto",
            columns: 3
          }, "templateDiv");
          templatePicker.startup();

          var layers = arrayUtils.map(evt.layers, function(result) {
            return { featureLayer: result.layer };
          });
          var settings = {
            map: map,
            templatePicker: templatePicker,
            layerInfos: layers,
            toolbarVisible: true,
            createOptions: {
              polylineDrawTools:[ Editor.CREATE_TOOL_FREEHAND_POLYLINE ],
              polygonDrawTools: [ Editor.CREATE_TOOL_FREEHAND_POLYGON,
                Editor.CREATE_TOOL_CIRCLE,
                Editor.CREATE_TOOL_TRIANGLE,
                Editor.CREATE_TOOL_RECTANGLE
              ]
            },
            toolbarOptions: {
              reshapeVisible: true
            }
          };

          var params = {settings: settings};    
          var myEditor = new Editor(params,'editorDiv');
          //define snapping options
          var symbol = new SimpleMarkerSymbol(
            SimpleMarkerSymbol.STYLE_CROSS, 
            15, 
            new SimpleLineSymbol(
              SimpleLineSymbol.STYLE_SOLID, 
              new Color([255, 0, 0, 0.5]), 
              5
            ), 
            null
          );
          map.enableSnapping({
            snapPointSymbol: symbol,
            tolerance: 20,
            snapKey: keys.ALT
          });
    
          myEditor.startup();
        }
      });
    </script>
  </head>
  <body class="claro">
    <div id="main" data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline'" style="height:width:100%;height:100%;">
      <div data-dojo-type="dijit/layout/ContentPane" id="header" data-dojo-props="region:'top'">
        Edit Hydrography
      </div>
      <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'left'" style="width: 300px;overflow:hidden;">
        <div id="templateDiv"></div>
        <div id="editorDiv"></div>
      </div>
      <div data-dojo-type="dijit/layout/ContentPane" id="map" data-dojo-props="region:'center'"></div>
    </div>
  </body>
</html>

RRubalcava

Do you have some sample code to get a better idea of what's happening?

Are you using the Edit Toolbar?

The edits-complete method is only emitted from a FeatureLayer after you use the applyEdits method.

Join the Conversation

Signed in members can post, follow updates, and more. New here? Register a free account.

Quick Links

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