Can you use a points feature class in attribute inspector? Mine are not working.

1358
5
Jump to solution
12-05-2014 01:51 PM
RobertKirkwood
Occasional Contributor III
<!DOCTYPE html>
<html> 
  <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 FeatureLayer in Selection Only Mode with Attribute Inspector</title>


    <link rel="stylesheet" href="http://js.arcgis.com/3.11/dijit/themes/claro/claro.css">
    <link rel="stylesheet" href="http://js.arcgis.com/3.11/esri/css/esri.css">
    <style>
      html, body { 
        height: 100%; width: 100%; 
        margin: 0;
        padding: 0;
        overflow: hidden;
      }
      #mapDiv{
        margin: 0;
        padding:0;
      }
      #detailPane{
        height:20px;
        color:#570026;
        font-size:12pt;
        font-weight:600;
        overflow:hidden;
      }
      .dj_ie .infowindow .window .top .right .user .content { position: relative; }
      .dj_ie .simpleInfoWindow .content {position: relative;}


      .esriAttributeInspector {height:100px;}
      .esriAttributeInspector .atiLayerName {display:none;}
      .saveButton {
        padding-left:45px;
         margin:0px;width:16px; height:16px;
       }
    </style>
    
    <script src="http://js.arcgis.com/3.11/"></script>
    <script>
      var map;
      var updateFeature;
      
      require([
        "esri/map",
        "esri/layers/FeatureLayer",
        "esri/dijit/AttributeInspector",
         "esri/symbols/SimpleMarkerSymbol",
        "esri/symbols/SimpleLineSymbol",
        "esri/symbols/SimpleFillSymbol",
        "esri/Color",


        "esri/layers/ArcGISDynamicMapServiceLayer",
        "esri/config",


        "esri/tasks/query",


        "dojo/parser", 
        "dojo/dom-construct",
        "dijit/form/Button",


        "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!"
      ], function(
        Map, FeatureLayer, AttributeInspector, SimpleMarkerSymbol,
        SimpleLineSymbol, SimpleFillSymbol, Color,
        ArcGISDynamicMapServiceLayer, esriConfig,
        Query,
        parser, domConstruct, Button
      ) {
        parser.parse();


        // refer to "Using the Proxy Page" for more information:  https://developers.arcgis.com/javascript/jshelp/ags_proxy.html
        //esriConfig.defaults.io.proxyUrl = "/proxy/";


        map = new Map("mapDiv", {
          basemap: "topo",
                    center: [-107.646372, 43.433484],
                    zoom: 7
        });


        map.on("layers-add-result", initSelectToolbar);


        var petroFieldsMSL = new ArcGISDynamicMapServiceLayer("https://wygiscservices-dev.wygisc.org/arcgis/rest/services/WyoBio/WyoBioMobile/MapServer");
        petroFieldsMSL.setDisableClientCaching(true);
        map.addLayer(petroFieldsMSL);


        var petroFieldsFL = new FeatureLayer("https://wygiscservices-dev.wygisc.org/arcgis/rest/services/WyoBio/WyoBioMobile/FeatureServer/0",
                        {
                            mode: FeatureLayer.MODE_SELECTION,
                            
                            outFields: ["*"]
                        });
        var selectionSymbol = new SimpleFillSymbol(
            SimpleFillSymbol.STYLE_NULL,
            new SimpleLineSymbol(
                "solid",
                new Color("yellow"),
                2
            ),
            null
        );
        petroFieldsFL.setSelectionSymbol(selectionSymbol);


        petroFieldsFL.on("edits-complete", function() {
          petroFieldsMSL.refresh();
        });


        map.addLayers([petroFieldsFL]);


        function initSelectToolbar(evt) {
          var petroFieldsFL = evt.layers[0].layer;
          var selectQuery = new Query();


          map.on("click", function(evt) {
            selectQuery.geometry = evt.mapPoint;
            petroFieldsFL.selectFeatures(selectQuery, FeatureLayer.SELECTION_NEW, function(features) {
              if (features.length > 0) {
                //store the current feature
                updateFeature = features[0];
                map.infoWindow.setTitle(features[0].getLayer().name);
                map.infoWindow.show(evt.screenPoint, map.getInfoWindowAnchor(evt.screenPoint));
              }
              else {
                map.infoWindow.hide();
              }
            });
          });


          map.infoWindow.on("hide", function() {
            petroFieldsFL.clearSelection();
          });


          var layerInfos = [
            {
              'featureLayer': petroFieldsFL,
              'showAttachments': true,
              'isEditable': true,
              'fieldInfos': [
                {'fieldName': 'HabDesc_', 'isEditable': true, 'tooltip': 'Current Status', 'label': 'Status:'},
                {'fieldName': 'WeatherConditions_', 'isEditable': true, 'tooltip': 'The name of this oil field', 'label': 'Field Name:'}
                
              ]
            }
          ];


          var attInspector = new AttributeInspector({
            layerInfos: layerInfos
          }, domConstruct.create("div"));


          //add a save button next to the delete button
          var saveButton = new Button({ label: "Save", "class": "saveButton"});
          domConstruct.place(saveButton.domNode, attInspector.deleteBtn.domNode, "after");


          saveButton.on("click", function() {
            updateFeature.getLayer().applyEdits(null, [updateFeature], null);
          });


          attInspector.on("attribute-change", function(evt) {
            //store the updates to apply when the save button is clicked 
            updateFeature.attributes[evt.fieldName] = evt.fieldValue;
          });


          attInspector.on("next", function(evt) {
            updateFeature = evt.feature;
            console.log("Next " + updateFeature.attributes.objectid);
          });


          attInspector.on("delete", function(evt) {
            evt.feature.getLayer().applyEdits(null, null, [evt.feature]);
            map.infoWindow.hide();
          });


          map.infoWindow.setContent(attInspector.domNode);
          map.infoWindow.resize(350, 240);
        }
      });
    </script>
  </head>
  
  <body class="claro">
    <div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline', gutters:false" style="width:100%;height:100%;">
      <div id="detailPane" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'top'">
        Click a field to display the attribute inspector with customized fields.
      </div>
      <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'" id="mapDiv"></div>
    </div>
  </body>
</html>
Tags (1)
0 Kudos
1 Solution

Accepted Solutions
KellyHutchins
Esri Frequent Contributor

Robert,

The sample you are using uses the clicked location to query for a geometry in the feature layer. This works fine for polygons but for points or lines you'll need to buffer the click point a bit in order to use it as the query geometry. Here's a revised version of your sample that includes additional logic in the map click event to create a buffer around the click point.

<!DOCTYPE html>

<html>

  <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 FeatureLayer in Selection Only Mode with Attribute Inspector</title>

    <link rel="stylesheet" href="http://js.arcgis.com/3.11/dijit/themes/claro/claro.css">

    <link rel="stylesheet" href="http://js.arcgis.com/3.11/esri/css/esri.css">

    <style>

      html, body {

        height: 100%; width: 100%;

        margin: 0;

        padding: 0;

        overflow: hidden;

      }

      #mapDiv{

        margin: 0;

        padding:0;

      }

      #detailPane{

        height:20px;

        color:#570026;

        font-size:12pt;

        font-weight:600;

        overflow:hidden;

      }

      .dj_ie .infowindow .window .top .right .user .content { position: relative; }

      .dj_ie .simpleInfoWindow .content {position: relative;}

      .esriAttributeInspector {height:100px;}

      .esriAttributeInspector .atiLayerName {display:none;}

      .saveButton {

        padding-left:45px;

        margin:0px;width:16px; height:16px;

      }

    </style>

 

    <script src="http://js.arcgis.com/3.11/"></script>

    <script>

      var map;

      var updateFeature;

   

      require([

        "esri/map",

        "esri/layers/FeatureLayer",

        "esri/dijit/AttributeInspector",

        "esri/symbols/SimpleMarkerSymbol",

        "esri/symbols/SimpleLineSymbol",

        "esri/symbols/SimpleFillSymbol",

        "esri/Color",

        "esri/layers/ArcGISDynamicMapServiceLayer",

        "esri/config",

        "esri/tasks/query",

        "esri/geometry/Extent",

        "dojo/parser",

        "dojo/dom-construct",

        "dijit/form/Button",

        "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!"

      ], function(

        Map, FeatureLayer, AttributeInspector, SimpleMarkerSymbol,

        SimpleLineSymbol, SimpleFillSymbol, Color,

        ArcGISDynamicMapServiceLayer, esriConfig,

        Query,Extent,

        parser, domConstruct, Button

      ) {

        parser.parse();

        map = new Map("mapDiv", {

          basemap: "topo",

                    center: [-107.646372, 43.433484],

                    zoom: 7

        });

        map.on("layers-add-result", initSelectToolbar);

        var petroFieldsMSL = new ArcGISDynamicMapServiceLayer("https://wygiscservices-dev.wygisc.org/arcgis/rest/services/WyoBio/WyoBioMobile/MapServer");

        petroFieldsMSL.setDisableClientCaching(true);

        map.addLayer(petroFieldsMSL);

        var petroFieldsFL = new FeatureLayer("https://wygiscservices-dev.wygisc.org/arcgis/rest/services/WyoBio/WyoBioMobile/FeatureServer/0",

                        {

                            mode: FeatureLayer.MODE_SELECTION,

                         

                            outFields: ["*"]

                        });

        var selectionSymbol = new SimpleFillSymbol(

            SimpleFillSymbol.STYLE_NULL,

            new SimpleLineSymbol(

                "solid",

                new Color("yellow"),

                2

            ),

            null

        );

        petroFieldsFL.setSelectionSymbol(selectionSymbol);

        petroFieldsFL.on("edits-complete", function() {

          petroFieldsMSL.refresh();

        });

        map.addLayers([petroFieldsFL]);

        function initSelectToolbar(evt) {

 

          var petroFieldsFL = evt.layers[0].layer;

          var selectQuery = new Query();

          map.on("click", function(evt) {

  

            var mapWidth = map.extent.getWidth();

            //Divide width in map units by width in pixels

            var pixelWidth = mapWidth/map.width;

            //Calculate a 10 pixel envelope width (5 pixel tolerance on each side)

            var tolerance = 10 * pixelWidth;

            //Build tolerance envelope and set it as the query geometry

            var queryExtent  = new esri.geometry.Extent

                (1,1,tolerance,tolerance,evt.mapPoint.spatialReference);

            selectQuery.geometry = queryExtent.centerAt(evt.mapPoint);

            //selectQuery.geometry = evt.mapPoint.extent.expand(2);

            petroFieldsFL.selectFeatures(selectQuery, FeatureLayer.SELECTION_NEW, function(features) {

              if (features.length > 0) {

                //store the current feature

                updateFeature = features[0];

                map.infoWindow.setTitle(features[0].getLayer().name);

                map.infoWindow.show(evt.screenPoint, map.getInfoWindowAnchor(evt.screenPoint));

              }

              else {

                map.infoWindow.hide();

              }

            });

          });

          map.infoWindow.on("hide", function() {

            petroFieldsFL.clearSelection();

          });

          var layerInfos = [

            {

              'featureLayer': petroFieldsFL,

              'showAttachments': true,

              'isEditable': true,

              'fieldInfos': [

                {'fieldName': 'HabDesc_', 'isEditable': true, 'tooltip': 'Current Status', 'label': 'Status:'},

                {'fieldName': 'WeatherConditions_', 'isEditable': true, 'tooltip': 'The name of this oil field', 'label': 'Field Name:'}

             

              ]

            }

          ];

          var attInspector = new AttributeInspector({

            layerInfos: layerInfos

          }, domConstruct.create("div"));

          console.log("Att");

          attInspector.on("attribute-change", function(evt) {

            //store the updates to apply when the save button is clicked

            updateFeature.attributes[evt.fieldName] = evt.fieldValue;

          });

          attInspector.on("next", function(evt) {

            updateFeature = evt.feature;

            console.log("Next " + updateFeature.attributes.objectid);

          });

          attInspector.on("delete", function(evt) {

            evt.feature.getLayer().applyEdits(null, null, [evt.feature]);

            map.infoWindow.hide();

          });

          map.infoWindow.setContent(attInspector.domNode);

          map.infoWindow.resize(350, 240);

        }

      });

    </script>

  </head>

  <body class="claro">

    <div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline', gutters:false" style="width:100%;height:100%;">

      <div id="detailPane" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'top'">

        Click a field to display the attribute inspector with customized fields.

      </div>

      <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'" id="mapDiv"></div>

    </div>

  </body>

</html>

View solution in original post

5 Replies
KellyHutchins
Esri Frequent Contributor

Yes points are supported with the attribute inspector. Do you get any errors when you run your application? If you haven't done so already try running your application with browser debugging tools (like Chrome Developer Tools) open and see if any error messages are written to the console.

RobertKirkwood
Occasional Contributor III

Kelly,

I am not getting any errors. I thought i posted my code above but do not see it...I will try again.

0 Kudos
RobertKirkwood
Occasional Contributor III

<!DOCTYPE html>

<html>

  <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 FeatureLayer in Selection Only Mode with Attribute Inspector</title>

    <link rel="stylesheet" href="http://js.arcgis.com/3.11/dijit/themes/claro/claro.css">

    <link rel="stylesheet" href="http://js.arcgis.com/3.11/esri/css/esri.css">

    <style>

      html, body {

        height: 100%; width: 100%;

        margin: 0;

        padding: 0;

        overflow: hidden;

      }

      #mapDiv{

        margin: 0;

        padding:0;

      }

      #detailPane{

        height:20px;

        color:#570026;

        font-size:12pt;

        font-weight:600;

        overflow:hidden;

      }

      .dj_ie .infowindow .window .top .right .user .content { position: relative; }

      .dj_ie .simpleInfoWindow .content {position: relative;}

      .esriAttributeInspector {height:100px;}

      .esriAttributeInspector .atiLayerName {display:none;}

      .saveButton {

        padding-left:45px;

        margin:0px;width:16px; height:16px;

      }

    </style>

  

    <script src="http://js.arcgis.com/3.11/"></script>

    <script>

      var map;

      var updateFeature;

    

      require([

        "esri/map",

        "esri/layers/FeatureLayer",

        "esri/dijit/AttributeInspector",

        "esri/symbols/SimpleMarkerSymbol",

        "esri/symbols/SimpleLineSymbol",

        "esri/symbols/SimpleFillSymbol",

        "esri/Color",

        "esri/layers/ArcGISDynamicMapServiceLayer",

        "esri/config",

        "esri/tasks/query",

        "dojo/parser",

        "dojo/dom-construct",

        "dijit/form/Button",

        "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!"

      ], function(

        Map, FeatureLayer, AttributeInspector, SimpleMarkerSymbol,

        SimpleLineSymbol, SimpleFillSymbol, Color,

        ArcGISDynamicMapServiceLayer, esriConfig,

        Query,

        parser, domConstruct, Button

      ) {

        parser.parse();

        // refer to "Using the Proxy Page" for more information:  https://developers.arcgis.com/javascript/jshelp/ags_proxy.html

        //esriConfig.defaults.io.proxyUrl = "/proxy/";

        map = new Map("mapDiv", {

          basemap: "topo",

                    center: [-107.646372, 43.433484],

                    zoom: 7

        });

        map.on("layers-add-result", initSelectToolbar);

        var petroFieldsMSL = new ArcGISDynamicMapServiceLayer("https://wygiscservices-dev.wygisc.org/arcgis/rest/services/WyoBio/WyoBioMobile/MapServer");

        petroFieldsMSL.setDisableClientCaching(true);

        map.addLayer(petroFieldsMSL);

        var petroFieldsFL = new FeatureLayer("https://wygiscservices-dev.wygisc.org/arcgis/rest/services/WyoBio/WyoBioMobile/FeatureServer/0",

                        {

                            mode: FeatureLayer.MODE_SELECTION,

                          

                            outFields: ["*"]

                        });

        var selectionSymbol = new SimpleFillSymbol(

            SimpleFillSymbol.STYLE_NULL,

            new SimpleLineSymbol(

                "solid",

                new Color("yellow"),

                2

            ),

            null

        );

        petroFieldsFL.setSelectionSymbol(selectionSymbol);

        petroFieldsFL.on("edits-complete", function() {

          petroFieldsMSL.refresh();

        });

        map.addLayers([petroFieldsFL]);

        function initSelectToolbar(evt) {

          var petroFieldsFL = evt.layers[0].layer;

          var selectQuery = new Query();

          map.on("click", function(evt) {

            selectQuery.geometry = evt.mapPoint;

            petroFieldsFL.selectFeatures(selectQuery, FeatureLayer.SELECTION_NEW, function(features) {

              if (features.length > 0) {

                //store the current feature

                updateFeature = features[0];

                map.infoWindow.setTitle(features[0].getLayer().name);

                map.infoWindow.show(evt.screenPoint, map.getInfoWindowAnchor(evt.screenPoint));

              }

              else {

                map.infoWindow.hide();

              }

            });

          });

          map.infoWindow.on("hide", function() {

            petroFieldsFL.clearSelection();

          });

          var layerInfos = [

            {

              'featureLayer': petroFieldsFL,

              'showAttachments': true,

              'isEditable': true,

              'fieldInfos': [

                {'fieldName': 'HabDesc_', 'isEditable': true, 'tooltip': 'Current Status', 'label': 'Status:'},

                {'fieldName': 'WeatherConditions_', 'isEditable': true, 'tooltip': 'The name of this oil field', 'label': 'Field Name:'}

              

              ]

            }

          ];

          var attInspector = new AttributeInspector({

            layerInfos: layerInfos

          }, domConstruct.create("div"));

          //add a save button next to the delete button

          var saveButton = new Button({ label: "Save", "class": "saveButton"});

          domConstruct.place(saveButton.domNode, attInspector.deleteBtn.domNode, "after");

          saveButton.on("click", function() {

            updateFeature.getLayer().applyEdits(null, [updateFeature], null);

          });

          attInspector.on("attribute-change", function(evt) {

            //store the updates to apply when the save button is clicked

            updateFeature.attributes[evt.fieldName] = evt.fieldValue;

          });

          attInspector.on("next", function(evt) {

            updateFeature = evt.feature;

            console.log("Next " + updateFeature.attributes.objectid);

          });

          attInspector.on("delete", function(evt) {

            evt.feature.getLayer().applyEdits(null, null, [evt.feature]);

            map.infoWindow.hide();

          });

          map.infoWindow.setContent(attInspector.domNode);

          map.infoWindow.resize(350, 240);

        }

      });

    </script>

  </head>

  <body class="claro">

    <div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline', gutters:false" style="width:100%;height:100%;">

      <div id="detailPane" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'top'">

        Click a field to display the attribute inspector with customized fields.

      </div>

      <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'" id="mapDiv"></div>

    </div>

  </body>

</html>

0 Kudos
KellyHutchins
Esri Frequent Contributor

Robert,

The sample you are using uses the clicked location to query for a geometry in the feature layer. This works fine for polygons but for points or lines you'll need to buffer the click point a bit in order to use it as the query geometry. Here's a revised version of your sample that includes additional logic in the map click event to create a buffer around the click point.

<!DOCTYPE html>

<html>

  <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 FeatureLayer in Selection Only Mode with Attribute Inspector</title>

    <link rel="stylesheet" href="http://js.arcgis.com/3.11/dijit/themes/claro/claro.css">

    <link rel="stylesheet" href="http://js.arcgis.com/3.11/esri/css/esri.css">

    <style>

      html, body {

        height: 100%; width: 100%;

        margin: 0;

        padding: 0;

        overflow: hidden;

      }

      #mapDiv{

        margin: 0;

        padding:0;

      }

      #detailPane{

        height:20px;

        color:#570026;

        font-size:12pt;

        font-weight:600;

        overflow:hidden;

      }

      .dj_ie .infowindow .window .top .right .user .content { position: relative; }

      .dj_ie .simpleInfoWindow .content {position: relative;}

      .esriAttributeInspector {height:100px;}

      .esriAttributeInspector .atiLayerName {display:none;}

      .saveButton {

        padding-left:45px;

        margin:0px;width:16px; height:16px;

      }

    </style>

 

    <script src="http://js.arcgis.com/3.11/"></script>

    <script>

      var map;

      var updateFeature;

   

      require([

        "esri/map",

        "esri/layers/FeatureLayer",

        "esri/dijit/AttributeInspector",

        "esri/symbols/SimpleMarkerSymbol",

        "esri/symbols/SimpleLineSymbol",

        "esri/symbols/SimpleFillSymbol",

        "esri/Color",

        "esri/layers/ArcGISDynamicMapServiceLayer",

        "esri/config",

        "esri/tasks/query",

        "esri/geometry/Extent",

        "dojo/parser",

        "dojo/dom-construct",

        "dijit/form/Button",

        "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!"

      ], function(

        Map, FeatureLayer, AttributeInspector, SimpleMarkerSymbol,

        SimpleLineSymbol, SimpleFillSymbol, Color,

        ArcGISDynamicMapServiceLayer, esriConfig,

        Query,Extent,

        parser, domConstruct, Button

      ) {

        parser.parse();

        map = new Map("mapDiv", {

          basemap: "topo",

                    center: [-107.646372, 43.433484],

                    zoom: 7

        });

        map.on("layers-add-result", initSelectToolbar);

        var petroFieldsMSL = new ArcGISDynamicMapServiceLayer("https://wygiscservices-dev.wygisc.org/arcgis/rest/services/WyoBio/WyoBioMobile/MapServer");

        petroFieldsMSL.setDisableClientCaching(true);

        map.addLayer(petroFieldsMSL);

        var petroFieldsFL = new FeatureLayer("https://wygiscservices-dev.wygisc.org/arcgis/rest/services/WyoBio/WyoBioMobile/FeatureServer/0",

                        {

                            mode: FeatureLayer.MODE_SELECTION,

                         

                            outFields: ["*"]

                        });

        var selectionSymbol = new SimpleFillSymbol(

            SimpleFillSymbol.STYLE_NULL,

            new SimpleLineSymbol(

                "solid",

                new Color("yellow"),

                2

            ),

            null

        );

        petroFieldsFL.setSelectionSymbol(selectionSymbol);

        petroFieldsFL.on("edits-complete", function() {

          petroFieldsMSL.refresh();

        });

        map.addLayers([petroFieldsFL]);

        function initSelectToolbar(evt) {

 

          var petroFieldsFL = evt.layers[0].layer;

          var selectQuery = new Query();

          map.on("click", function(evt) {

  

            var mapWidth = map.extent.getWidth();

            //Divide width in map units by width in pixels

            var pixelWidth = mapWidth/map.width;

            //Calculate a 10 pixel envelope width (5 pixel tolerance on each side)

            var tolerance = 10 * pixelWidth;

            //Build tolerance envelope and set it as the query geometry

            var queryExtent  = new esri.geometry.Extent

                (1,1,tolerance,tolerance,evt.mapPoint.spatialReference);

            selectQuery.geometry = queryExtent.centerAt(evt.mapPoint);

            //selectQuery.geometry = evt.mapPoint.extent.expand(2);

            petroFieldsFL.selectFeatures(selectQuery, FeatureLayer.SELECTION_NEW, function(features) {

              if (features.length > 0) {

                //store the current feature

                updateFeature = features[0];

                map.infoWindow.setTitle(features[0].getLayer().name);

                map.infoWindow.show(evt.screenPoint, map.getInfoWindowAnchor(evt.screenPoint));

              }

              else {

                map.infoWindow.hide();

              }

            });

          });

          map.infoWindow.on("hide", function() {

            petroFieldsFL.clearSelection();

          });

          var layerInfos = [

            {

              'featureLayer': petroFieldsFL,

              'showAttachments': true,

              'isEditable': true,

              'fieldInfos': [

                {'fieldName': 'HabDesc_', 'isEditable': true, 'tooltip': 'Current Status', 'label': 'Status:'},

                {'fieldName': 'WeatherConditions_', 'isEditable': true, 'tooltip': 'The name of this oil field', 'label': 'Field Name:'}

             

              ]

            }

          ];

          var attInspector = new AttributeInspector({

            layerInfos: layerInfos

          }, domConstruct.create("div"));

          console.log("Att");

          attInspector.on("attribute-change", function(evt) {

            //store the updates to apply when the save button is clicked

            updateFeature.attributes[evt.fieldName] = evt.fieldValue;

          });

          attInspector.on("next", function(evt) {

            updateFeature = evt.feature;

            console.log("Next " + updateFeature.attributes.objectid);

          });

          attInspector.on("delete", function(evt) {

            evt.feature.getLayer().applyEdits(null, null, [evt.feature]);

            map.infoWindow.hide();

          });

          map.infoWindow.setContent(attInspector.domNode);

          map.infoWindow.resize(350, 240);

        }

      });

    </script>

  </head>

  <body class="claro">

    <div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline', gutters:false" style="width:100%;height:100%;">

      <div id="detailPane" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'top'">

        Click a field to display the attribute inspector with customized fields.

      </div>

      <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'" id="mapDiv"></div>

    </div>

  </body>

</html>

RobertKirkwood
Occasional Contributor III

Thanks so much again! This made my day!

0 Kudos