Skip to content

Instantly share code, notes, and snippets.

@nommuna2
Last active April 26, 2019 21:19
Show Gist options
  • Save nommuna2/23549249bcc955789cf2a337d17e7537 to your computer and use it in GitHub Desktop.
Save nommuna2/23549249bcc955789cf2a337d17e7537 to your computer and use it in GitHub Desktop.
(ArcGIS API for JavaScript) Sample of creating a form in a popup and using applyEdits operation to make edits to the feature layer.
require([
"esri/Map",
"esri/views/MapView",
"esri/layers/FeatureLayer",
"esri/widgets/Popup",
"esri/Graphic",
"dojo/domReady!"
],
function (Map, MapView, FeatureLayer, Popup, Graphic) {
//Create a new map and set the basemap to Dark gray
var map = new Map({
basemap: "dark-gray",
//layers: [featureLayer]
});
//set a new view and set the properties of the view
var view = new MapView({
container: "viewDiv",
map: map,
center: [-86.049, 38.485],
zoom: 3
});
var fl = new FeatureLayer({
url: "URl to a feature layer"
});
map.add(fl);
//On click show the popup window with the lat long and set the content to the form function.
view.on("click", function(e) {
e.stopPropagation();
console.log(e);
view.popup.open({
title: "Clicked location: [" + e.mapPoint.longitude + ", " + e.mapPoint.latitude + "]",
});
view.popup.content = form();
});
//This function sets up a simple form. Where the user enters a number then clicks submit to apply edits to the feature layer
function form () {
//Create the form
var container = document.createElement('div');
var popField = document.createElement('input');
var button = document.getElementById('submitData');
popField.setAttribute("type", "text");
container.appendChild(popField);
container.appendChild(button);
//Add an event listener on "click"
button.addEventListener("click", function(e){
//Set up the attributes
var attributes = {};
attributes["POP2000"] = popField.value;
// Create a new Graphic with the geometry and the attributes
var addFeature = new Graphic({
geometry: e.mapPoint,
attributes: attributes
});
//Once the feature layer has loaded onto the map, apply the edits to the feature layer
fl.load().then(function(){
fl.applyEdits({
addFeatures:[addFeature]
}).then(function (result) {
console.log(result);
alert("Successfully added new feature with objectId of: " + result.addFeatureResults[0].objectId)
}).catch(function (err){
console.error(err.code);
});
});
});
return container;
}
});
@nommuna2
Copy link
Author

nommuna2 commented May 21, 2018

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment