Community

Any JavaScript sample to edit SDE layers

753
2
02-19-2014 09:34 AM
JoseSanchez
by
Occasional Contributor III
‎02-19-2014 09:34 AM
Hi all

I need to write a JavaScript editing application to digitize points. Is there any sample that works with SDE? And with versioned layers in SDE?

Thanks
0 Kudos
2 Replies
GaneshSolai_Sambandam
by
New Contributor III
‎02-20-2014 09:19 AM
http://resources.arcgis.com/en/help/main/10.1/index.html#//0154000005mm000000


HI

Try this code, this should help. 

<html lang="en">
   <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>Editable Points of Interest and Evacuation Map for Sheep Fire</title>

     <!-- include dojo theme -->
     <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.2/js/dojo/dijit/themes/claro/claro.css">
     <style type="text/css">
       .dj_ie .infowindow .window .top .right .user .content { position: relative; }
       .dj_ie .simpleInfoWindow .content {position: relative;}
     </style>
     <style>
       html, body { height: 100%; width: 100%; margin: 0; padding: 0; overflow:hidden; }
       #leftPane{
         overflow:hidden;
         width:250px;
         border:none;
       }
       #map{
         padding:0;
       }
       #header{
         font-weight:600;
         font-size:14pt;
         color:#666666;
         padding-left:20px;
       }
     </style>

     <!-- specify dojo configuration to parse dijits at load time -->
     <script type="text/javascript">
         djConfig = {
             parseOnLoad: true
         };
     </script>

     <!-- reference ArcGIS JavaScript API -->
     <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.2"></script>
     <script type="text/javascript">
         //require selection dijit
         dojo.require("esri.map");
         dojo.require("esri.dijit.editing.Editor-all");
         dojo.require("dijit.layout.ContentPane");
         dojo.require("dijit.layout.BorderContainer");

         var map;
         var resizeTimer;
         var firePerimeter;
         var evacuationPerimeter;
         var pointsOfInterest;
         var fLayer, edLayer;
         var templatePicker, myEditor;
         var editLayers;
         var editorWidget;

         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 = "/arcgisserver/apis/javascript/proxy/proxy.ashx";

             //This service is for development and testing purposes only. We recommend that you create your own geometry service for use within your applications. 
             esri.config.defaults.geometryService = new esri.tasks.GeometryService("http://sampleserver3.arcgisonline.com/arcgis/rest/services/Geometry/GeometryServer");


             var initialExtent = new esri.geometry.Extent({ "xmin": -117.66, "ymin": 34.19, "xmax": -117.41, "ymax": 34.37, "spatialReference": { "wkid": 4326 } });
             map = new esri.Map("map", { extent: esri.geometry.geographicToWebMercator(initialExtent), slider: false, nav: true });

             dojo.connect(map, "onLoad", function () {
                 dojo.connect(dijit.byId('map'), 'resize', function () {
                     resizeMap();
                 });
             });

             dojo.connect(map, "onLayersAddResult", initEditor);

             var basemap = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer");
             map.addLayer(basemap);

              pointsOfInterest = new esri.layers.FeatureLayer("http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Fire/Sheep/FeatureServer/0", {
                 mode: esri.layers.FeatureLayer.MODE_ONDEMAND, //QUERY_SELECTION is working as well
                 outFields: ['*']
             });

              evacuationPerimeter = new esri.layers.FeatureLayer("http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Fire/Sheep/FeatureServer/1", {
                  mode: esri.layers.FeatureLayer.MODE_ONDEMAND, //QUERY_SELECTION is working as well
                  outFields: ['*']
              });

             firePerimeter = new esri.layers.FeatureLayer("http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Fire/Sheep/FeatureServer/2", {
                 mode: esri.layers.FeatureLayer.MODE_ONDEMAND, //QUERY_SELECTION is working as well
                 outFields: ['*']
             });

           //  map.addLayers([pointsOfInterest, evacuationPerimeter]);
         }

         function fireEd() {

             //alert("fireEd");   
             //map.removeAllLayers();
             if (fLayer) {
                 map.removeLayer(fLayer);
             }
             //dojo.connect(map, "onLayersAddResult", initEditor);
             var myLyrList = document.getElementById("myList");
             edLayer = myLyrList.options[myList.selectedIndex].text;
             //alert(myLyrList.options[myList.selectedIndex].value);   
             switch (myLyrList.options[myList.selectedIndex].value) {
                 case "0":
                     fLayer = pointsOfInterest;
                     break;
                 case "1":
                     fLayer = evacuationPerimeter;
                     break;
                 case "2":
                     fLayer = firePerimeter;
                     break;
             }

         
             map.addLayers([fLayer]);
             
         }


         function initEditor(results) {

             editLayers = dojo.map(results, function (result) {
                 return {
                     'featureLayer': result.layer
                 };
             });
             createEditor();
         }
         //Functions to create and destroy the editor. We do this each time the edit button is clicked. 
         function createEditor() {

             if (editorWidget) {
                 editorWidget.destroy();
                 editorWidget = null;
                // return;
             }
             if (editLayers.length > 0) {
                 //create template picker 
                 var templateLayers = dojo.map(editLayers, function (layer) {
                     return layer.featureLayer;
                 });

                 var eDiv = dojo.create("div", {
                     id: "templDiv"
                 });
                 dojo.byId('leftPane').appendChild(eDiv);
                 var editLayerInfo = editLayers;
                 var templatePicker = new esri.dijit.editing.TemplatePicker({
                     featureLayers: templateLayers,
                     rows: 'auto',
                     columns: 'auto',
                   //  style: 'height:98%;width:98%;'
                 }, 'templDiv');
                 templatePicker.startup();

                 var settings = {
                     map: map,
                     templatePicker: templatePicker,
                     layerInfos: editLayerInfo,
                     toolbarVisible: true
                 };
                 var params = {
                     settings: settings
                 };
                 var eDiv1 = dojo.create("div", {
                     id: "editDiv"
                 });
                 dojo.byId('leftPane').appendChild(eDiv1);
                 editorWidget = new esri.dijit.editing.Editor(params, "editDiv");
                 editorWidget.startup();
             }

         }

         function destroyEditor() {
             if (editorWidget) {
                 editorWidget.destroy();
                 editorWidget = null;
             }

         }

         

                  
         //Handle resize of browser
         function resizeMap() {
             clearTimeout(resizeTimer);
             resizeTimer = setTimeout(function () {
                 map.resize();
                 map.reposition();
             }, 500);
         }
         dojo.addOnLoad(init);
     </script>
   </head>
   <body class="claro">    
     <div dojotype="dijit.layout.BorderContainer" design="headline" style="width:100%;height:100%;">
       <div dojotype="dijit.layout.ContentPane"  id="header" region="top">Editable Fire Map</div>
       <div id="map" dojotype="dijit.layout.ContentPane" region="center"></div>
       <div id="leftPane" dojotype="dijit.layout.ContentPane"  region="left">

            <select id="myList" onchange="fireEd()">
     <option value="">Choose layer to edit</option> 
           <option value="0">Points of Interest</option> 
                 <option value="1">Evacuation Perimeter</option> 
                <option value="2">Fire Perimeter</option> 
        </select><br><br>

            <input type="button" onclick="createEditor();" value="Create Editor" disabled/>
        <input type="button" onclick="destroyEditor();" value="Destroy Editor"disabled/>


         <div id="templateDiv"></div>
         <div id="editorDiv"></div>
       </div>
     </div>
   </body>
 </html>
0 Kudos