Setting feature layer selection symbol using ArcGIS API for JavaScript

Question

I'm trying to add functionality to select a group of parcels as laid out in this example, and display queried information for those parcels in a popup info window. I've got it displaying the queried data in an infowindow correctly, and it highlights the correct parcel for the info being displayed, but I'm having issues highlighting every selected parcel. In the above example it sets the selection symbol with setSelectionSymbol(), but for whatever reason this isn't working for me, and I'm not exactly sure what I'm doing wrong.

I've included the parts of my code that are relevant to my problem, including parts that deal with toggling the parcel layer on and off in a legend.

function init() {
 
 //initialize popup window
 var popup = new esri.dijit.Popup({
 fillSymbol: new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([255,0,0]), 2), new dojo.Color([255,255,0,0.25]))
 }, dojo.create("div"));
 
 //add geometry service from server
 esri.config.defaults.geometryService = new esri.tasks.GeometryService("http://2501s-jjohnson:6080/arcgis/rest/services/Utilities/Geometry/GeometryServer");
 
 //initalize map
 app.map = new esri.Map("map", {
 basemap : "satellite",
 center : [-111.924531, 40.611871],
 zoom : 13,
 infoWindow: popup
 });
 
 //query parcel and show info in popup window
 function executeIdentifyTask(evt) {
 var query = new esri.tasks.Query();
 query.geometry = pointToExtent(app.map,evt.mapPoint,10);
 var deferred = featureParcel.selectFeatures(query,esri.layers.FeatureLayer.SELECTION_NEW);
 app.map.infoWindow.setFeatures([deferred]);
 app.map.infoWindow.show(evt.mapPoint);
 console.log(evt.mapPoint);
 
 }
 
 //trigger feature layer parcel query if parcels are turned on 
 function clickConnect(connect){
 if(connect){
 //perform the identify task on click 
 clickHandler = dojo.connect(app.map, "onClick", executeIdentifyTask);
 }else{
 //disconnect the click handler 
 dojo.disconnect(clickHandler);
 clickHandler = null;
 }
 }
 //add parcel layer
 var parcels = new esri.layers.ArcGISDynamicMapServiceLayer("http://2501s-jjohnson:6080/arcgis/rest/services/Parcels_UT/MapServer", {
 id : 'parcels',
 visible : false
 });
 parcelLayer.push({
 layer : parcels,
 title : 'Parcels'
 });
 
 //add parcel feature layer query info for popup window
 var content = "<b>Address</b>: ${ADDR}" + "<br /><b>Owner Name</b>: ${OWNER}" + "<br /><b>Parcel ID</b>: ${APN}" + "<br /><b>City</b>: ${CITY}" + "<br /><b>Acres</b>: ${TOTAL_ACRES}"+ " <br /><a href='${COUNTY_LINK}' target='_blank'>County Assessor Site</a>" 
 var popUpTemplate = new esri.InfoTemplate("Parcel", content); 
 
 //add parcel feature layer
 featureParcel = new esri.layers.FeatureLayer("http://2501s-jjohnson:6080/arcgis/rest/services/Parcels_UT/MapServer/0",{
 mode: esri.layers.FeatureLayer.MODE_SELECTION,
 outFields: ["*"],
 infoTemplate:popUpTemplate
 });
 //set selection Symbol
 var selectionSymbol = new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([255,255,0,0.5]));
 selectionSymbol.setOutline(new esri.symbol.SimpleLineSymbol("solid", new dojo.Color([255,0,0]), 2));
 featureParcel.setSelectionSymbol(selectionSymbol);
 
 //create legend
 dojo.connect(app.map, 'onLayersAddResult', function(results) {
 var legend = new esri.dijit.Legend({
 map : app.map,
 layerInfos : legendLayers
 }, "retail");
 legend.startup();
 });
 //add all layers to map
 app.map.addLayers([parcels]);
 //add layer arrays into legend object
 legendLayers["parcel"] = parcelLayer;
 
 dojo.connect(app.map, 'onLayersAddResult', function(results) {
 //for each layer array in legend object
 for (var k in legendLayers){
 //add legend check boxes for each layer
 //to toggle layer visibility
 dojo.forEach(legendLayers[k], function(layer) {
 var layerName = layer.title;
 var checkBox = new dijit.form.CheckBox({
 name : "checkBox" + layer.layer.id,
 value : layer.layer.id,
 checked : layer.layer.visible,
 onChange : function(evt) {
 var clayer = app.map.getLayer(this.value);
 clayer.setVisibility(!clayer.visible);
 this.checked = clayer.visible;
 
 //toggle the feature layer parcel query
 //parcelClick indicates whether the parcel layer is on
 if (this.value ==="parcels" && this.checked === true){
 clickConnect(true);
 parcelClick = true;
 } else if (this.value ==="parcels"){
 clickConnect(false);
 parcelClick = false;
 }
 }
 });
 //add the check box and label to the table of contnents
 dojo.place(checkBox.domNode, dojo.byId(k), "after");
 var checkLabel = dojo.create('label', {
 'for' : checkBox.name,
 innerHTML : layerName
 }, checkBox.domNode, "after");
 dojo.place("<br />", checkLabel, "after");
 });
 }
 });
 dojo.connect(app.map, "onLoad", initSelectToolbar);
 }
 
 function initSelectToolbar(map) {
 selectionToolbar = new esri.toolbars.Draw(map);
 var selectQuery = new esri.tasks.Query();
 
 dojo.connect(selectionToolbar, "onDrawEnd", function(geometry) {
 selectionToolbar.deactivate();
 selectQuery.geometry = geometry;
 var deferred = featureParcel.selectFeatures(selectQuery, esri.layers.FeatureLayer.SELECTION_NEW);
 app.map.infoWindow.setFeatures([deferred]);
 app.map.infoWindow.show();
 
 });
}
 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.ready(init);

Answer 1

You are doing two things going on here. You have a click handler, that, when there is a click on the map, it creates a new selection using the point geometry from the click. That handler is toggled on and off by your clickConnect function.

But you also have a draw handler, that on draw end creates a new selection using the geometry from the drawing toolbar. That handler is not toggled on and off by your clickConnect function. It executes whether or not the parcel layer is on.

Try logging to console when either one of these selection queries is triggered. Since both of them create a new selection, I suspect that you are having a conflict between the two selections executing. (And likely the onDrawEnd selection is tripping off even when the parcel layer is turned off.)