Bewerk functie buiten de kaart met behulp van formulier

Question

<\/HEAD>Ik ben heel nieuw met ESRI - en ik hoop een *manier* te vinden om dit formulier in een uniek adresseerbare pagina te plaatsen zodat het snel bewerkt\/geprioriteerd kan worden door medewerkers: (meer hieronder) <\/P> ...het werkt voor mij niet om dit formulier ALLEEN beschikbaar te hebben door op een pictogram te klikken zodra je op een web-map bent... er kunnen tientallen pictogrammen op een kaart staan, en medewerkers moeten direct naar het specifieke item worden gebracht om dit te bewerken. <\/P> Ik waardeer echt alle suggesties. <\/P> Achtergrond:<\/P> We hebben "Crowdsource Reporter" geïmplementeerd voor openbare inzendingen. Die inzendingen, uit 8 verschillende categorieën ("domains", geloof ik) worden via AGOL opgehaald via FME (een ETL), en vervolgens gepusht\/geconsolideerd in een *enkele* lijst op ons Intranet (sharepoint 2013 lijst). We hebben dit gedaan in plaats van "crowdsource manager" te gebruiken omdat de publieke domains niet gelijkmatig overeenkomen met onze 13 interne afdelingen die de problemen beheren - dus we hebben webmaps gemaakt die de verschillende lagen filteren om ze specifiek af te stemmen op de specifieke problemen (probleemtypen) van elke afdeling uit die domains.<\/P> Ik wil dat elk probleem\/item in de sharepoint intranetlijst (die ze allemaal categoriseert voor medewerkers als "nieuw" "in behandeling" en "voltooid") een veld\/kolom heeft dat een dynamische URL is die een medewerker direct naar de bewerkingsweergave van dat specifieke probleem brengt. Alvast bedankt voor alle suggesties. Mijn beste gok is dat de GlobalID in een URL moet worden geplaatst... Ik ben ook onervaren met de API. Tips zijn welkom.<\/P> Sharepoint-gegevens van bovengenoemd probleem:<\/P> <\/P><\/BODY><\/HTML>

RobertScheitlin__GISP · Answer

Jake, You could consider using the JS API 4.x FeatureForm to do this. FeatureForm | API Reference | ArcGIS API for JavaScript 4.10 Here is a sample: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no"> <title>Update Feature Attributes - 4.10</title> <link rel="stylesheet" href="https://js.arcgis.com/4.10/esri/css/main.css"> <script src="https://js.arcgis.com/4.10/"></script> <style> html, body, #update { height: 100%; width: 100%; margin: 0; padding: 0; } #update { padding: 6px; } #form{ background: #fff; } /* replaces esri-widget--panel */ .scroller { overflow-x: hidden; overflow-y: auto; } </style> <script> require([ "esri/widgets/FeatureForm", "esri/layers/FeatureLayer" ], function( FeatureForm, FeatureLayer) { let highlight, editFeature; const featureLayer = new FeatureLayer({ portalItem: { id: "449887ea7d60429fbf6f0c67881f2758" } }); featureLayer.load(); function getUrlVars() { var vars = {}; var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) { vars[key] = value; }); return vars; } // Add a new feature form with grouped fields const form = new FeatureForm({ container: "form", groupDisplay: "sequential", // only display one group at a time layer: featureLayer, fieldConfig: [{ // autocastable to FieldGroupConfig label: "Inspector information", // Inspector group description: "Field inspector information", // individual field configurations within the group fieldConfig: [{ // autocastable as FieldConfig name: "inspector", label: "Name" },{ name: "inspemail", label: "Email address" },{ name: "insp_date", label: "Date of inspection" }] },{ // Contact group label: "Contact information", description: "The insured's contact information", fieldConfig: [{ // autocastable as FieldConfig name: "placename", label: "Business name" },{ name: "firstname", label: "First name" },{ name: "lastname", label: "Last name" },{ name: "workphone", label: "Work telephone number" }] },{ // Insurance coverage group label: "Insurance coverage", description: "Structure and contents coverage", fieldConfig: [{ // autocastable as FieldConfig name: "strinsur", label: "Structure insured" },{ name: "continsur", label: "Contents insured" }] },{ // Insurance type group label: "Insurance type information", description: "Type of insurance coverage", fieldConfig: [{ // autocastable as FieldConfig name: "rentinsur", label: "Renter's" },{ name: "floodinsur", label: "Flood" },{ name: "fireinsur", label: "Fire" }] }] }); featureLayer.watch("loaded", function(){ var vars = getUrlVars(); if(vars.hasOwnProperty('oid')){ selectFeature(parseInt(vars.oid)); } }); // Highlight the clicked feature and display // its attributes in the featureform. function selectFeature(objectId) { // query feature from the server featureLayer.queryFeatures({ objectIds: [objectId], outFields: ["*"], returnGeometry: true }).then(function(results) { if (results.features.length > 0) { editFeature = results.features[0]; // display the attributes of selected feature in the form form.feature = editFeature; } }); } // Listen to the feature form's submit event. form.on("submit", function() { if (editFeature) { // Grab updated attributes from the form. const updated = form.getValues(); // Loop through updated attributes and assign // the updated values to feature attributes. Object.keys(updated).forEach(function(name) { editFeature.attributes[name] = updated[name]; }); // Setup the applyEdits parameter with updates. const edits = { updateFeatures: [editFeature] }; applyAttributeUpdates(edits); } }); // Call FeatureLayer.applyEdits() with specified params. function applyAttributeUpdates(params) { document.getElementById("btnUpdate").style.cursor = "progress"; featureLayer.applyEdits(params).then(function(editsResult) { // Get the objectId of the newly added feature. // Call selectFeature function to highlight the new feature. if (editsResult.addFeatureResults.length > 0) { const objectId = editsResult.addFeatureResults[0].objectId; selectFeature(objectId); } document.getElementById("btnUpdate").style.cursor = "pointer"; }) .catch(function(error) { console.log("==============================================="); console.error("[ applyEdits ] FAILURE: ", error.code, error.name, error.message); console.log("error = ", error); document.getElementById("btnUpdate").style.cursor = "pointer"; }); } document.getElementById("btnUpdate").onclick = function() { // Fires feature form's submit event. form.submit(); } }); </script> </head> <body> <div id="update" class="esri-widget"> <div id="form" class="scroller esri-component"></div> <input type="button" class="esri-button" value="Update assessment" id="btnUpdate"> </div> </body> </html> ‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍ The url has to have the parameter "oid" matching and ObjectId in the featureLayer RohanOprisko_1-1626198753536.png