<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=7, IE=9, IE=10"> <!--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>Delete Feature</title> <link rel="stylesheet" href="http://localhost/arcgis_js_api/library/3.5/jsapi/dojo/dijit/themes/claro/claro.css"> <link rel="stylesheet" href="http://localhost/arcgis_js_api/library/3.5/jsapi/esri/css/esri.css"> <style> html, body { height: 100%; width: 100%; margin: 0; padding: 0; overflow:hidden; } #map{ padding:0px; border:solid 2px #1A84AD; -moz-border-radius: 4px; border-radius: 4px; } #rightPane{ border:none; width:300px; </style> <script>var dojoConfig = { parseOnLoad:true };</script> <script src="http://localhost/arcgis_js_api/library/3.5/jsapi/init.js"></script> <script> dojo.require("dijit.layout.BorderContainer"); dojo.require("dijit.layout.ContentPane"); dojo.require("esri.map"); dojo.require("dijit.Menu"); dojo.require("dijit.form.Button"); dojo.require("esri.dijit.editing.TemplatePicker-all"); dojo.require("esri.dijit.editing.editOperation"); //VARIABLES var map; //var undoManager; // FUNCTION INITIALIZE function init() { //specify the number of undo operations allowed using the maxOperations parameter //undoManager = new esri.UndoManager({ maxOperations: 10 }); // PROXY PAGE CONFIGURATION esri.config.defaults.io.proxyUrl = "http://localhost/Proxy/proxy.ashx"; // MAP EXTENT DEFINITION var initialExtent = new esri.geometry.Extent({xmin: 2089355.926669004,ymin: 212687.42173663445,xmax: 2198005.6105589992,ymax: 303894.02712456253,"spatialReference": {"wkid": 2267} }); // MAP map = new esri.Map("map", { extent: initialExtent }); //CONNECT MAP WITH DELETE FEATURE EDITING FUNCTIONALITY dojo.connect(map, "onLayersAddResult", EditingDeleteFeature); // FEATURE LAYERS FOR EDITING var publictreeinventory = new esri.layers.FeatureLayer("http://localhost/arcgis/rest/services/UrbanForestry/PublicTreeInventorySDE02/FeatureServer/0",{ mode: esri.layers.FeatureLayer.MODE_ONDEMAND, outFields: ['*'] }); var emergencymanagement = new esri.layers.FeatureLayer("http://localhost/arcgis/rest/services/EmergencyManagement/EmergencyManagementSDE02/FeatureServer/0",{ mode: esri.layers.FeatureLayer.MODE_ONDEMAND, outFields: ['*'] }); var plantingsites = new esri.layers.FeatureLayer("http://localhost/arcgis/rest/services/UrbanForestry/PublicTreeInventorySDE02/FeatureServer/1",{ //id: plantingsitesID, mode: esri.layers.FeatureLayer.MODE_ONDEMAND, outFields: ['*'] }); map.addLayers([publictreeinventory, emergencymanagement, plantingsites]); } // DELETE TOOL function EditingDeleteFeature(results) { var deleteFeatureslLayer = results[0].layer; var layers = dojo.map(results, function(result) { return result.layer; }); // Ctrl+click to delete features and add this delete operation to undomanager dojo.connect(deleteFeatureslLayer, "onClick", function(evt) { dojo.stopEvent(evt); // DELETE FEATURE IS DELETE BUTTON IS CHECKED (ACTIVE) if (dijit.byId("tool_delete").checked) { deleteFeatureslLayer.applyEdits(null, null, [evt.graphic], function() { operation = new esri.dijit.editing.Delete({ featureLayer: deleteFeatureslLayer, deletedGraphics: [evt.graphic] }); }); } }); } dojo.ready(init); </script> </head> <body class="claro"> <div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="gutters:true, design:'sidebar'" style="width:100%;height:100%;"> <div id="map" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'center'"></div> <div id="rightPane" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'right'"> <div id="tool_delete" data-dojo-type="dijit.form.ToggleButton" data-dojo-props="checked:false, iconClass:'dijitCheckBoxIcon'">Delete</div> <div class='instructions'> <ul style="list-style:none;padding-left:4px;"> <li><b>To delete feature:</b> <br> Click on the Delete button to check and activate delete features. Left mouse click on feature to delete. Uncheck Delete button when finished.</li> </ul> </div> </div> </div> </body> </html>
Solved! Go to Solution.
// DELETE TOOL function EditingDeleteFeature(results) { var layers = dojo.map(results, function (result) { return result.layer; }); // Ctrl+click to delete features and add this delete operation to undomanager dojo.forEach(layers, function (deleteFeatureslLayer) { dojo.connect(deleteFeatureslLayer, "onClick", function (evt) { dojo.stopEvent(evt); // DELETE FEATURE IS DELETE BUTTON IS CHECKED (ACTIVE) if (dijit.byId("tool_delete").checked) { deleteFeatureslLayer.applyEdits(null, null, [evt.graphic], function () { operation = new esri.dijit.editing.Delete({ featureLayer: deleteFeatureslLayer, deletedGraphics: [evt.graphic] }); }); } }); }); }
// DELETE TOOL function EditingDeleteFeature(results) { var deleteFeatureslLayer = results[0].layer; var layers = dojo.map(results, function (result) { return result.layer; }); // Ctrl+click to delete features and add this delete operation to undomanager dojo.connect(deleteFeatureslLayer, "onClick", function (evt) { dojo.stopEvent(evt); // DELETE FEATURE IS DELETE BUTTON IS CHECKED (ACTIVE) if (dijit.byId("tool_delete").checked) { deleteFeatureslLayer.applyEdits(null, null, [evt.graphic], function () { operation = new esri.dijit.editing.Delete({ featureLayer: deleteFeatureslLayer, deletedGraphics: [evt.graphic] }); }); } }); }
// DELETE TOOL function EditingDeleteFeature(results) { var layers = dojo.map(results, function (result) { return result.layer; }); // Ctrl+click to delete features and add this delete operation to undomanager dojo.forEach(layers, function (deleteFeatureslLayer) { dojo.connect(deleteFeatureslLayer, "onClick", function (evt) { dojo.stopEvent(evt); // DELETE FEATURE IS DELETE BUTTON IS CHECKED (ACTIVE) if (dijit.byId("tool_delete").checked) { deleteFeatureslLayer.applyEdits(null, null, [evt.graphic], function () { operation = new esri.dijit.editing.Delete({ featureLayer: deleteFeatureslLayer, deletedGraphics: [evt.graphic] }); }); } }); };
Try to change:
// DELETE TOOL function EditingDeleteFeature(results) { var deleteFeatureslLayer = results[0].layer; var layers = dojo.map(results, function (result) { return result.layer; }); // Ctrl+click to delete features and add this delete operation to undomanager dojo.connect(deleteFeatureslLayer, "onClick", function (evt) { dojo.stopEvent(evt); // DELETE FEATURE IS DELETE BUTTON IS CHECKED (ACTIVE) if (dijit.byId("tool_delete").checked) { deleteFeatureslLayer.applyEdits(null, null, [evt.graphic], function () { operation = new esri.dijit.editing.Delete({ featureLayer: deleteFeatureslLayer, deletedGraphics: [evt.graphic] }); }); } }); }
To:
// DELETE TOOL function EditingDeleteFeature(results) { var layers = dojo.map(results, function (result) { return result.layer; }); // Ctrl+click to delete features and add this delete operation to undomanager dojo.forEach(layers, function (deleteFeatureslLayer) { dojo.connect(deleteFeatureslLayer, "onClick", function (evt) { dojo.stopEvent(evt); // DELETE FEATURE IS DELETE BUTTON IS CHECKED (ACTIVE) if (dijit.byId("tool_delete").checked) { deleteFeatureslLayer.applyEdits(null, null, [evt.graphic], function () { operation = new esri.dijit.editing.Delete({ featureLayer: deleteFeatureslLayer, deletedGraphics: [evt.graphic] }); }); } }); };
}
// DELETE TOOL function EditingDeleteFeature(results) { var layers = dojo.map(results, function (result) { return result.layer; }); // Ctrl+click to delete features and add this delete operation to undomanager dojo.forEach(layers, function (deleteFeatureslLayer) { dojo.connect(deleteFeatureslLayer, "onClick", function (evt) { dojo.stopEvent(evt); // DELETE FEATURE IS DELETE BUTTON IS CHECKED (ACTIVE) if (dijit.byId("tool_delete").checked) { deleteFeatureslLayer.applyEdits(null, null, [evt.graphic], function () { operation = new esri.dijit.editing.Delete({ featureLayer: deleteFeatureslLayer, deletedGraphics: [evt.graphic] }); }); } }); };
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=7, IE=9, IE=10"> <!--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>UndoManager</title> <link rel="stylesheet" href="http://js.arcgis.com/3.7/js/dojo/dijit/themes/claro/claro.css"> <link rel="stylesheet" href="http://js.arcgis.com/3.7/js/esri/css/esri.css"> <style> html, body { height: 100%; width: 100%; margin: 0; padding: 0; overflow:hidden; } .instructions{ padding-top:20px; font-size:12px; } .undoButtons{ width:60%; margin-left:auto; margin-right:auto; padding-top:4px; } #map{ padding:0px; border:solid 2px #1A84AD; -moz-border-radius: 4px; border-radius: 4px; } #rightPane{ border:none; width:300px; } .templatePicker { border:solid 2px #1A84AD !important; } .undoIcon { background-image:url(images/undo.png); width:16px; height:16px; } .redoIcon { background-image:url(images/redo.png); width:16px; height:16px;} </style> <script>var dojoConfig = { parseOnLoad:true };</script> <script src="http://js.arcgis.com/3.7/"></script> <script> dojo.require("dijit.layout.BorderContainer"); dojo.require("dijit.layout.ContentPane"); dojo.require("esri.map"); dojo.require("esri.dijit.editing.TemplatePicker-all"); dojo.require("esri.dijit.AttributeInspector-all"); dojo.require("esri.dijit.editing.editOperation"); var map; function init() { //This sample requires a proxy page to handle communications with the ArcGIS Server services. You will need to //replace the url below with the location of a proxy on your machine. See the 'Using the proxy page' help topic //for details on setting up a proxy page. esri.config.defaults.io.proxyUrl = "/proxy"; esri.config.defaults.io.alwaysUseProxy = false; map = new esri.Map("map", { basemap: "topo", center: [-97.367, 37.691], zoom: 14 }); dojo.connect(map, "onLayersAddResult", initEditing); var landuseLayer = new esri.layers.FeatureLayer("http://sampleserver6.arcgisonline.com/arcgis/rest/services/Military/FeatureServer/6", { mode: esri.layers.FeatureLayer.MODE_SNAPSHOT, outFields: ["*"] }); var militaryareas = new esri.layers.FeatureLayer("http://sampleserver6.arcgisonline.com/arcgis/rest/services/Military/FeatureServer/9", { mode: esri.layers.FeatureLayer.MODE_SNAPSHOT, outFields: ["*"] }); map.addLayers([landuseLayer, militaryareas]); } function initEditing(results) { var layers = dojo.map(results, function (result) { return result.layer; }); // Ctrl+click to delete features and add this delete operation to undomanager //dojo.forEach(layers, function (deleteFeatureslLayer) { dojo.connect(deleteFeatureslLayer, "onClick", function (evt) { dojo.stopEvent(evt); // DELETE FEATURE IS DELETE BUTTON IS CHECKED (ACTIVE) if (dijit.byId("tool_delete").checked) { deleteFeatureslLayer.applyEdits(null, null, [evt.graphic], function () { operation = new esri.dijit.editing.Delete({ featureLayer: deleteFeatureslLayer, deletedGraphics: [evt.graphic] }); }); } }); } dojo.ready(init); </script> </head> <body class="claro"> <div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="gutters:true, design:'sidebar'" style="width:100%;height:100%;"> <div id="map" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'center'"></div> <div id="rightPane" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'right'"> <div id="templatePickerDiv"></div> <div class="undoButtons"> <button id="undo" data-dojo-type="dijit.form.Button" data-dojo-props="disabled:true, iconClass:'undoIcon'" >Undo</button> <button id="redo" data-dojo-type="dijit.form.Button" data-dojo-props="disabled:true, iconClass:'redoIcon'" >Redo</button> <div id="tool_delete" data-dojo-type="dijit.form.ToggleButton" data-dojo-props="checked:false, iconClass:'dijitCheckBoxIcon'">Delete</div> </div> <div class='instructions'> <ul style="list-style:none;padding-left:4px;"> <li><b>Create Features:</b> Select template then click on map.</li> <li><b>Delete Features:</b> Ctrl or Cmd + Click feature.</li> </ul> The undo/redo buttons will become enabled after editing the feature attributes or geometry. </div> </div> </div> </body> </html>
// DELETE TOOL function EditingDeleteFeature(results) { var layers = dojo.map(results, function (result) { return result.layer; }); // Ctrl+click to delete features and add this delete operation to undomanager dojo.forEach(layers, function (deleteFeatureslLayer) { dojo.connect(deleteFeatureslLayer, "onClick", function (evt) { dojo.stopEvent(evt); // DELETE FEATURE IS DELETE BUTTON IS CHECKED (ACTIVE) if (dijit.byId("tool_delete").checked) { deleteFeatureslLayer.applyEdits(null, null, [evt.graphic], function () { operation = new esri.dijit.editing.Delete({ featureLayer: deleteFeatureslLayer, deletedGraphics: [evt.graphic] }); }); } }); }); }