Disable button based on zoom

deleted-user-yA_w_FC9FKe5

I have a button that is summarizing data but I want the toggle button to only be enabled when at a certain zoom and then disabled when above it.  How can I do this?

        new ToggleButton({
          showLabel: true,
          onChange: function(val){           
            if(val == true){
     document.getElementById("messages").style.display = 'block'
     buffer = map.on("click", function(evt){
                circle = new Circle({
                center: evt.mapPoint,
                geodesic: true,
                radius: 1,
                radiusUnit: "esriMiles"
              });
              //Being used
     map.graphics.clear();
              map.infoWindow.hide();
              var graphic = new Graphic(circle, circleSymb);
              map.graphics.add(graphic);

              var query = new Query();
              query.geometry = circle.getExtent();
              //use a fast bounding box query. will only go to the server if bounding box is outside of the visible map
              featureLayer.queryFeatures(query, selectInBuffer);
            });
            this.set('label', 'Close Buffer Report Tool');
           }
           else{
   map.graphics.clear();
            featureLayer.clearSelection();
            buffer.remove();            
            document.getElementById("messages").style.display = 'none'
   this.set('label', 'Open Buffer Report Tool');
  
   dom.byId("messages").innerHTML = "Click on the map <br> to select 5 mile buffer.";
           }
          },
          label: "Open Buffer Report Tool"
        }, "btnBufferTool");

BradleySnider

Michael,

Steve's suggestion is definitely the way you want to go.  You can also use the more general extent-change event handler.  The full code to turn the button on/off based on zoom level is the following.  Just change the level, which is set at 13 in this example:

map.on("extent-change", changeZoom);

function changeZoom(evt){
 if (evt.lod.level > 13) {
  alert("Current Scale is high: " + evt.lod.level);
  document.getElementById("btnBufferTool").disabled = true;
 }

 else {
  alert("Current Scale is low: " + evt.lod.level);
  document.getElementById("btnBufferTool").disabled = false;
 }
}

Brad