topic Re: Help using the selectedRecords property of the FeatureTable widget in ArcGIS JS API 3.2 in ArcGIS JavaScript Maps SDK Questions

Help using the selectedRecords property of the FeatureTable widget in ArcGIS JS API 3.2

ShannonDeArmond — Sat, 11 Dec 2021 21:18:24 GMT

I'm trying to figure out the best way to query a table in my js application and make a list of attributes for use elsewhere in my application (for example in the attached code, I'm trying to query the table for all records in California so I can then make a list of all the counties in that state). I thought the selectedRows property would give me exactly what I needed, and while my selection is coming up with the proper number of records, the selectedRows object array is empty. Can anyone tell me what I'm doing wrong? Or if I should take another approach all together?

<!DOCTYPE html>
<html>

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <link rel="stylesheet" href="https://js.arcgis.com/3.20/dijit/themes/claro/claro.css">
  <link rel="stylesheet" href="https://js.arcgis.com/3.20/esri/css/esri.css">
  <script src="https://js.arcgis.com/3.20/"></script>

  <style>
    html, 
    body, 
    #myTableNode {
      width:100%;
      height:100%;
      margin:0;
      padding:0;
    }

  </style>

  <script>
    var map;

    require([
      "esri/layers/FeatureLayer",
      "esri/tasks/query",
      "esri/dijit/FeatureTable",
      "dojo/dom",
      "dojo/parser",
      "dojo/ready",
    ], function (
      FeatureLayer, Query, FeatureTable,
      dom, parser, ready
    ) {

      parser.parse();

      ready(function(){

        // Creates a feature layer
        var myFeatureLayer = new FeatureLayer("https://services.arcgis.com/V6ZHFr6zdgNZuVG0/ArcGIS/rest/services/Census_Counties_20m/FeatureServer/0", {
          mode: FeatureLayer.MODE_ONDEMAND,
          outFields:  ["FID", "STATE", "COUNTY", "NAME"],
          visible: true,
          id: "fLayer"
        });
        
     // Creates a feature table from the feature layer
        myTable = new FeatureTable({
          featureLayer : myFeatureLayer,
          showGridMenu: true
        }, "myTableNode");

        myTable.startup();
        
     // Creates a selection on the feature table
        var query = new Query();
        query.where = "STATE = '06'";
        myFeatureLayer.queryIds(query, function(objectIds){
          console.log(objectIds);
          myTable.selectRows(objectIds);
       myTable.filterSelectedRecords();
          var myRows = myTable.selectedRows;
          if (myRows) {
            console.log(myRows.length);
          }
        });
      });
    });
  </script>
</head>

<body class="claro esri">
  <div id="myTableNode"></div>
</body>

</html> ‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Help using the selectedRecords property of the FeatureTable widget in ArcGIS JS API 3.2

RobertScheitlin__GISP — Sat, 11 Dec 2021 21:18:27 GMT

Shannon,

See my comments in this code:

<!DOCTYPE html>
<html>

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <link rel="stylesheet" href="https://js.arcgis.com/3.20/dijit/themes/claro/claro.css">
  <link rel="stylesheet" href="https://js.arcgis.com/3.20/esri/css/esri.css">
  <script src="https://js.arcgis.com/3.20/"></script>

  <style>
    html,
    body,
    #myTableNode {
      width:100%;
      height:100%;
      margin:0;
      padding:0;
    }

  </style>

  <script>
    var map;

    require([
      "esri/layers/FeatureLayer",
      "esri/tasks/query",
      "esri/dijit/FeatureTable",
      "dojo/dom",
      "dojo/parser",
      "dojo/ready",
      "dojo/on"
    ], function (
      FeatureLayer, Query, FeatureTable,
      dom, parser, ready, on
    ) {

      parser.parse();

      ready(function(){

        // Creates a feature layer
        var myFeatureLayer = new FeatureLayer("https://services.arcgis.com/V6ZHFr6zdgNZuVG0/ArcGIS/rest/services/Census_Counties_20m/FeatureServer/0", {
          mode: FeatureLayer.MODE_SNAPSHOT,
          outFields:  ["FID", "STATE", "COUNTY", "NAME"],
          visible: true,
          id: "fLayer"
        });

     // Creates a feature table from the feature layer
        myTable = new FeatureTable({
          featureLayer : myFeatureLayer,
          showGridMenu: true
        }, "myTableNode");

        myTable.startup();
        
//If you want to get the count of the filtered records you listen for the filter event
        on(myTable, "filter", function(evt){
          console.info(evt.ids.length);
        });

//This event will only fire when the user selects row(s) manualy
//then you can get myTable.selectedRows
        on(myTable, "row-select", function(evt){
          console.info(myTable.selectedRows);
        });

     // Creates a selection on the feature table
        var query = new Query();
        query.where = "STATE = '06'";
        query.returnGeometry = false;
        myFeatureLayer.queryIds(query, function(objectIds){
          console.log(objectIds);
          myTable.selectRows(objectIds);
          myTable.filterSelectedRecords();
        });
      });
    });
  </script>
</head>

<body class="claro esri">
  <div id="myTableNode"></div>
</body>

</html>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Help using the selectedRecords property of the FeatureTable widget in ArcGIS JS API 3.2

EdwinRoa — Sat, 11 Dec 2021 21:18:30 GMT

Try This.

<!DOCTYPE html>
<html>

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <link rel="stylesheet" href="https://js.arcgis.com/3.20/dijit/themes/claro/claro.css">
  <link rel="stylesheet" href="https://js.arcgis.com/3.20/esri/css/esri.css">
  <script src="https://js.arcgis.com/3.20/"></script>

  <style>
    html, 
    body, 
    #myTableNode {
      width:100%;
      height:100%;
      margin:0;
      padding:0;
    }

  </style>

  <script>
    var map;

    require([
      "esri/layers/FeatureLayer",
      "esri/tasks/query",
      "esri/dijit/FeatureTable",
      "dojo/dom",
      "dojo/parser",
      "dojo/ready",
    ], function (
      FeatureLayer, Query, FeatureTable,
      dom, parser, ready
    ) {

      parser.parse();
      ready(function(){
          // Creates a feature layer
        var myFeatureLayer = new FeatureLayer("https://services.arcgis.com/V6ZHFr6zdgNZuVG0/ArcGIS/rest/services/Census_Counties_20m/FeatureServer/0", {
          mode: FeatureLayer.MODE_ONDEMAND,
          outFields:  ["FID", "STATE", "COUNTY", "NAME"],
          visible: true,
          id: "fLayer"
        });
        
          // Creates a feature table from the feature layer
        myTable = new FeatureTable({
          featureLayer : myFeatureLayer,
          showGridMenu: true
        }, "myTableNode");

        myTable.startup();
        
          myTable.on("load", function(){
               // Creates a selection on the feature table
               var query = new Query();
               query.where = "STATE = '06'";
               myFeatureLayer.queryIds(query, function(objectIds){
                    console.log(objectIds);
                    myTable.selectRows(objectIds);
               });
            
               myTable.on("refresh", function(){
                    myTable.getFeatureDataById(myTable.selectedRowIds).then(function(features){
                         console.log("features", features.features);
                    });
               });
          });
      });
    });
  </script>
</head>

<body class="claro esri">
  <div id="myTableNode"></div>
</body>

</html>

‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Help using the selectedRecords property of the FeatureTable widget in ArcGIS JS API 3.2

ShannonDeArmond — Mon, 01 May 2017 16:34:19 GMT

Thank you both! Both Robert Scheitlin, GISP and eroaesri-co-esridist solutions worked for me though I think Edwin's solution will best fit my needs in this case. Thank you for taking the time to help a beginner.