AnsweredAssumed Answered

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

Question asked by schlot on Sep 5, 2014
Latest reply on Sep 8, 2014 by kenbuja

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?

Outcomes