AnsweredAssumed Answered

what is the correct way to clear the features when using a deferred method on popups

Question asked by schlot on Sep 26, 2012
Latest reply on Sep 26, 2012 by schlot
I have a project which is just shaded counties indicating where events are scheduled.  I have a column "scheduledEvent" in my data I'm populating elsewhere.  There is a hyperlink to a web page where there is an event.

I wanted to show a different popup if the user clicked a nonshaded county.  My code checks to see the value of ScheduledEvent in an If statement.

I thought I was done, but then I realized if I clicked a county a 2nd time, instead of getting the "Sorry no events" infoWindow, it reverts back to the other infoTemplate, which shows the county name and hyperlink instead.

I tried adding a popup.clearFeatures() at the start of the OnClick function, but it still seems to be remembering my previous "click". 

What is the proper way to completely remove my selected features. Set my deferred variable to null?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">  <html>    <head>      <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>      <meta http-equiv="X-UA-Compatible" content="IE=7,IE=9" />      <!--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>Rural Health Day Events</title>      <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/dojo/dijit/themes/claro/claro.css">      <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/esri/css/esri.css">     <link rel="stylesheet" type='text/css' href='http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/esri/dijit/css/Popup.css'/>            <style type="text/css">        html, body { height: 100%; width: 100%; margin: 0; padding: 0; }               #map{          padding:0;        }          </style>       <script type="text/javascript">var dojoConfig = {parseOnLoad: true};</script>      <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.2"></script>           <script type="text/javascript" language="Javascript">           dojo.require("esri.map");        dojo.require("esri.layers.FeatureLayer");        dojo.require("esri.dijit.InfoWindow");        dojo.require("esri.dijit.Popup");         var map;        var pathName = "http://gis.dhss.mo.gov/arcgis/rest/services";       var countyFeatureLayer;       var featureInfoTemplate;        var noEventTemplate;                 function init() {          var popup = new esri.dijit.Popup({          fillSymbol: new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_NULL,            new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([255,255,0]), 3), new dojo.Color([255,255,0,0.35]))          }, dojo.create("div"));                   var spatialReference = new esri.SpatialReference({wkid: 102100 });         startExtent = new esri.geometry.Extent(-10583000, 4287025, -9979000, 4980462, spatialReference);          map = new esri.Map("mapDiv", {extent: startExtent , logo:false, infoWindow:popup  });      dojo.connect(map,"onClick",function(evt){      popup.clearFeatures();           var query = new esri.tasks.Query();            query.geometry = pointToExtent(map,evt.mapPoint,5);                   var deferred = countyFeatureLayer.selectFeatures(query, esri.layers.FeatureLayer.SELECTION_NEW, function (selection) {             var eventStatus = selection[0].attributes['ScheduledEvent'];             if (eventStatus == "No") {                 map.infoWindow.setTitle("Sorry");                  map.infoWindow.setContent("No Events Scheduled");                     map.infoWindow.show(evt.mapPoint);                                         }else {                 map.infoWindow.setFeatures([deferred]);                   map.infoWindow.show(evt.mapPoint);             }           });         });       dojo.connect(popup,"onHide",function(){     popup.clearFeatures();   });     var countyLayer = new esri.layers.ArcGISDynamicMapServiceLayer(pathName+"/RuralHealthDayEvents/MapServer",{id:'events'});   map.addLayer(countyLayer);         featureInfoTemplate = new esri.InfoTemplate( "Events", "<b>${NAME}</b><br/><a href= ${pageLink} target=_blank ;'>See Rural Health Day Events for ${NAME} County</a>");          countyFeatureLayer = new esri.layers.FeatureLayer(pathName+"/RuralHealthDayEvents/MapServer/0", {            mode: esri.layers.FeatureLayer.MODE_SELECTION,            outFields: ["NAME", "ScheduledEvent", "PageLink"] ,           infoTemplate: featureInfoTemplate                  });                          map.addLayer(countyFeatureLayer);                dojo.connect(map, 'onLoad', function(theMap) {            //resize the map when the browser resizes           dojo.connect(dijit.byId('map'), 'resize', map,map.resize);          });        }              function pointToExtent(map, point, toleranceInPixel) {         var pixelWidth = map.extent.getWidth() / map.width;         var toleraceInMapCoords = toleranceInPixel * pixelWidth;         return new esri.geometry.Extent( point.x - toleraceInMapCoords,                      point.y - toleraceInMapCoords,                      point.x + toleraceInMapCoords,                      point.y + toleraceInMapCoords,                      map.spatialReference );                                   }               dojo.addOnLoad(init);      </script>    </head>    <body class="claro">     Click a shaded county to get information on their Rural Health Day event.     <div id="mapDiv" style="width:900px; height:600px; border:1px solid #000;"></div>    </body>  </html>    

Outcomes