Add, update, and delete data in a hosted feature layer.
Prerequisites
This tutorial requires an ArcGIS Location Platform or ArcGIS Online account.
Steps
Create a new pen
- If you are using the CDN libraries, to get started.
Get an access token
You need an access token with the correct privileges to access the resources used in this tutorial.
-
Go to the Create an API key tutorial and create an API key with the following privilege(s):
- Privileges:
- Item access
- Note: If you are using your own custom data layer for this tutorial, you need to grant the API key credentials access to the layer item. Learn more in Item access privileges.
-
Copy the API key access token to your clipboard when prompted.
-
In CodePen, update the
access
variable to use your access token.Token Use dark colors for code blocks Copy const accessToken = "YOUR_ACCESS_TOKEN"; const authentication = arcgisRest.ApiKeyManager.fromKey(accessToken);
To learn about the other types of authentication available, go to Types of authentication.
Make the request
Copy and paste the code below, following the steps to make a request to the feature service.
-
Reference the ArcGIS REST JS libraries either through CDN, ES Modules, or Node JS.
-
- Set the
access
with an API key access token from API key credentials.Token
- Set the
-
Define the parameters needed for the request.
-
Call the feature service and handle the results.
<!-- require ArcGIS REST JS libraries from https://unpkg.com -->
<script src="https://unpkg.com/@esri/arcgis-rest-request@4/dist/bundled/request.umd.js"></script>
<script src="https://unpkg.com/@esri/arcgis-rest-feature-service@4/dist/bundled/feature-service.umd.js"></script>
<script>
/* when including ArcGIS REST JS all exports are available
from the same arcgisRest global */
const accessToken = "YOUR_ACCESS_TOKEN";
const authentication = arcgisRest.ApiKeyManager.fromKey(accessToken);
const featureServiceLayerUrl = "https://services3.arcgis.com/GVgbJbqm8hXASVYi/ArcGIS/rest/services/my_points/FeatureServer/0";
const featureToAdd = {
attributes: {
id: 101,
name: "editing test",
rating: "2"
},
geometry: {
x: -118.807,
y: 34.002,
spatialReference: {
wkid: 4326
}
}
};
// begin by adding a new feature to the feature service layer,
// then update its attributes,
// and finally delete it from the layer
arcgisRest
.addFeatures({
url: featureServiceLayerUrl,
features: [featureToAdd],
authentication
})
.then(handleAdded);
function handleAdded(response) {
console.log(response);
document.getElementById("result-add").textContent = JSON.stringify(response, null, 2);
if (!response.addResults[0].success) {
// stop early if adding a new feature was not successful
return;
}
// perform an update to feature attributes using the objectId of the newly added feature
const featureToUpdate = {
attributes: {
objectId: response.addResults[0].objectId,
name: "new name",
rating: "3"
}
};
arcgisRest
.updateFeatures({
url: featureServiceLayerUrl,
features: [featureToUpdate],
authentication
})
.then(handleUpdated);
}
function handleUpdated(response) {
console.log(response);
document.getElementById("result-update").textContent = JSON.stringify(response, null, 2);
if (!response.updateResults[0].success) {
// stop early if updating the feature was not successful
return;
}
// delete the feature using the objectId of the updated feature
// NOTE: it is the same objectId provided in the response of `arcgisRest.addFeatures`
const featureToDelete = [response.updateResults[0].objectId];
arcgisRest
.deleteFeatures({
url: featureServiceLayerUrl,
objectIds: [featureToDelete],
authentication
})
.then(handleDeleted);
}
function handleDeleted(response) {
console.log(response);
document.getElementById("result-delete").textContent = JSON.stringify(response, null, 2);
}
</script>
Result
Below is the response from the service:
[
{
"addResults": [
{
"objectId": 5948,
"uniqueId": 5948,
"globalId": null,
"success": true
}
]
},
{
"updateResults": [
{
"objectId": 5948,
"uniqueId": 5948,
"globalId": null,
"success": true
}
]
},
{
"deleteResults": [
{
"objectId": 5948,
"uniqueId": 5948,
"globalId": null,
"success": true
}
]
What's next?
Learn how to use additional ArcGIS location services in these tutorials:
Query a feature layer (spatial)
Access and query a hosted feature layer with a geometry and spatial operator.
Query a feature layer (SQL)
Access and query a hosted feature layer with a SQL where clause.
Find service areas
Create a service area that can be reached from a location within a drive time with the route service.