Issues with dgrid Selection, only selected records are shown, can't restore

TracySchloss — Fri, 05 Sep 2014 14:14:33 GMT

I have a dGrid declared with both Selection and selector, to have check boxes for each row. I let the user select multiple rows and use those to create a chart. In addition, if they click on a single feature on the map, this also creates a chart for just that feature. This is all working, my problem is with what is happening to my grid. Once I've gone through the process of creating my chart, either from the grid selection, or the click on the featureLayer, my grid only contains the selected records I used for the chart and nothing else. I can't figure out how to get my grid back to it's previously unselected, all records original.

This is how I'm creating my grid. It's generated as a results handler on a featureLayer.queryFeatures where the query contains a where clause of 1=1, so it returns all records. My grid has the correct data in it and shows all records.

The grid doesn't have hard coded column names. I have a function that builds the columns from an array of field names I define earlier.

function createGrid(results) {
  domConstruct.empty(dom.byId('gridDiv'));
    var gridColumns = buildColumns();

   var data = arrayUtils.map(results.featureSet.features, function(feature){     
      return feature.attributes;
   });
    var currentMemory = new Memory ({data:data, idProperty:'OBJECTID'}); 
  grid = new (declare([Grid, Selection, selector]))({
        id:'grid', 
        columns: gridColumns, 
        selectionMode:'single',
        store: currentMemory
        }, "gridDiv"); 
       grid.sort('County');    

}
//creates a column definition for the grid based on the attributes returned from the query
  function buildColumns() {
       var columns = [];
 //qryOutFields is an array of fieldNames defined earlier
    arrayUtils.forEach(qryOutFields, function(field){
            var objects = {};
            objects.label = field;
            objects.field = field;
            if (field === 'OBJECTID') {//assumed name for internal ID from map service
                objects.hidden = true;
            }
            columns.push(objects);
        });
          var sel = selector({ label: '', sortable: false });  
            columns.splice(0, 0, sel);  
         return columns;
}

The Make Chart button executes the function getIdFromGrid, checks to see what's currently selected in the grid, gathers the objectids and county names. The initializeChart uses those objectIDs to execute another query to get the attributes for those records. These become the input needed for the chart (the lists of rates and the maximum value for the Y axis) Last, it calls a function to finish the chart.

function getIdFromGrid(){
   var rowid,gQuery;
idList.length = 0;
  countyList.length = 0;
  maxList.length = 0;
    for (var rowid in grid.selection) {
      var row = grid.row(rowid);   
      idList.push(parseFloat(rowid));  //list of objectIds
      countyList.push(row.data.County);  // list of county names
    }
   initializeChart();
}
function initializeChart(){
 // console.log("county list = " + countyList);
  domConstruct.empty("chartDiv");
  lineChart = new Chart2D("chartDiv");
  gQuery = new Query();                                      
  gQuery.objectIds = idList;  
  seriesList.length = 0;
    featureLayer.queryFeatures(gQuery, function(results) {  
     arrayUtils.forEach(results.features, function (result){
       createRateList(result);//builds an array of attributes for each records
       });
   });
   var maxRate = findMax(maxList);
   var maxVal = Math.round(maxRate);
   var axisYMax =  (parseInt(maxVal/10)+1)*10; //extends the Y axis to an even interval
   finishLineChart(axisYMax);
}

In finishLineChart, my chart gets created. That function is rather long, so I'm leaving it out. Once the chart is displayed, the grid changes. It only includes the selection made when I executed Make Chart. I can't figure out how to get back to the 'unselected' state. I have a clear button where I'm attempting to get rid of everything I can think of. I've thought of running another query of '1=1' just to select all my features again, but that seems extreme.

  registry.byId('btnClearChart').on('click', function (){
    grid.clearSelection();
    featureLayer.clearSelection();
     grid.refresh();
   
 });

Is there some other method of clearing out my grid selection and getting back to the original? I've used grids in nearly every map I've created, but this is the first time I've used either Selection or selector. I'm wondering if there is something buggy in other of those?

Re: Issues with dgrid Selection, only selected records are shown, can't restore

RiyasDeen — Sat, 06 Sep 2014 12:11:22 GMT

Hi Tracy,

dgrid would refresh only when you change it's store, with new data. I don't see that happening in the code you have posted.

I would recommend you to sweep through the code to double check if you are overriding your grid's store property. Look for ".store = " and setStore in your code this is how you could override your grid's store.

My prime suspect is your createRateList function.

Re: Issues with dgrid Selection, only selected records are shown, can't restore

KenBuja — Mon, 08 Sep 2014 15:09:33 GMT

I thought it might be an issue with the selectors not being cleared when the selection is cleared from this issue‌, but adding a Clear All button to the Selector test code (the full list of dGrid tests is here) seems to work perfectly fine. You can see the code here.

topic Re: Issues with dgrid Selection, only selected records are shown, can't restore in ArcGIS JavaScript Maps SDK Questions

Issues with dgrid Selection, only selected records are shown, can't restore

Re: Issues with dgrid Selection, only selected records are shown, can't restore

Re: Issues with dgrid Selection, only selected records are shown, can't restore