bundarrabandito

Graphics layer doesn't clear properly

Discussion created by bundarrabandito on Feb 2, 2012
Hi all,

In my app, users can search for attributes and results are sent to a datagrid.  Simultaneously, the map zooms to the extent of the query results featureset.  The user can then click on a row in the grid and a graphic will be added to a graphics layer on the map.  This works well.  However, I've included a 'clear selected lots' button that clears the selected lots from the map (it simply clears the graphics layer).  This also works.  But if I click the 'clear lots' button and then pan the map, the graphics reappear on the map.  I'm relatively new to the AGS JSAPI so it's probably an easy fix.

Thanks in advance for any help or suggestions.

Ed

Code:

Adding the graphics layer:

selectedLotsLayer = new esri.layers.GraphicsLayer();
map.addLayer(selectedLotsLayer);


Query function:
function doLotQuery() {

 if(dijit.byId("results").style.display = "block") {
  dijit.byId("results").style.display = "none"
 }
 dojo.connect(queryTask, "onComplete", function(featureSet) {
  //build an array of attributes
  items = dojo.map(featureSet.features, function(feature) {
   return feature.attributes;
  });
  if(featureSet.features.length > 1) {
   if(dijit.byId("results").style.display = "none") {
    dojo.style("results", "display", "block");
    dijit.byId("results").resize();
    var geometry, extent, ext;
    dojo.forEach(featureSet.features, function(feature, i) {
     geometry = feature.geometry;

     if( geometry instanceof esri.geometry.Extent) {
      ext = geometry;
     } else {
      ext = geometry.getExtent();
     }
     if(extent) {
      extent = extent.union(ext);
     } else {
      extent = new esri.geometry.Extent(ext);
     }
    });
    if (selectedLotsLayer.graphics.length > 0) {
     selectedLotsLayer.clear();
    }
    map.setExtent(extent);
   }
  } else {
   var singleLotResult
   dojo.forEach(featureSet.features, function(feature) {
    map.graphics.add(feature);
   });
   dojo.forEach(map.graphics.graphics, function(graphic) {
    singleLotResult = graphic;
   });
   var singleLotResultExtent = singleLotResult.geometry.getExtent().expand(10.0);
   singleLotResult.setSymbol(highlightSymbol);
   map.setExtent(singleLotResultExtent);
  }
  var data = {
   identifier : "objectid",
   items : items
  };
  store = new dojo.data.ItemFileReadStore({
   data : data
  });
  grid.setStore(store);
  grid.setSortIndex(1, "true");
  //sort on the section number

  dojo.forEach(featureSet.features, function(feature) {
   map.graphics.add(feature);
  });
  document.getElementById("loader").style.visibility = "hidden";
 });
 queryTask.execute(query);
 document.getElementById("loader").style.visibility = "visible";
}


Click handler for the datagrid row:
function onRowClickHandler(evt) {

 if(dijit.byId("goToLotsButton").disabled = 'true') {
  dijit.byId("goToLotsButton").setAttribute('disabled', false)
 };
 if(dijit.byId("clearLotsButton").disabled = 'true') {
  dijit.byId("clearLotsButton").setAttribute('disabled', false)
 };
 clickedLotId = grid.getItem(evt.rowIndex).objectid;
 dojo.forEach(map.graphics.graphics, function(graphic) {
  if((graphic.attributes) && graphic.attributes.objectid === clickedLotId) {
   selectedLot = graphic;
   return;
  }
 });
 selectedLot.setSymbol(highlightSymbol);
 selectedLotsLayer.add(selectedLot);
}


The clear selected lots code:
function clearSelectedLots() {

 if(dijit.byId("goToLotsButton").disabled = 'false') {
  dijit.byId("goToLotsButton").setAttribute('disabled', true)
 };
 if(dijit.byId("clearLotsButton").disabled = 'false') {
  dijit.byId("clearLotsButton").setAttribute('disabled', true)
 };
 selectedLotsLayer.clear();
}

Outcomes