earthdawg

url parameter popup, and measure widget

Discussion created by earthdawg on Jun 11, 2012
Latest reply on Jan 24, 2018 by Stephen.Patterson77
Hello,

I am trying to disable the url parameter popup while I am using the measure widget.  I am able to hide the window when I click the measure widget and when I double click to end, but DURING the measurement the url parameter popup keeps........well...........popping up.  Any help would be appreciated.  Here is the code below I have been working with from the Javascript sample section in resources.arcgis.com.

<!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>Parcel Locator</title>
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.8/js/dojo/dijit/themes/claro/claro.css">
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.8/js/esri/dijit/css/Popup.css">
    <style>
      html, body {
        height: 100%;
        width: 100%;
        margin: 0;
        padding: 0;
      }
      .esriScalebar {
        padding: 20px 20px;
      }
      #map {
        padding:0;
      }
    </style>
    <script type="text/javascript">
      var djConfig = {
        parseOnLoad: true
      };
    </script>
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.8"></script>
    <script type="text/javascript">
      dojo.require("dijit.layout.BorderContainer");
      dojo.require("dijit.layout.ContentPane");
      dojo.require("esri.map");
      dojo.require("esri.layers.FeatureLayer");
   dojo.require("esri.dijit.Measurement");
      dojo.require("esri.dijit.Popup");

      var map;
      var parcels;

      function init() {
        //apply a selection symbol that determines the symbology for selected features 
        var sfs = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([111, 0, 255]), 2), new dojo.Color([111, 0, 255, 0.15]));

        var popup = new esri.dijit.Popup({
          fillSymbol: sfs
        }, dojo.create("div"));

        map = new esri.Map("map", {
          infoWindow: popup,
          slider: false
        });
        var basemap = new esri.layers.ArcGISTiledMapServiceLayer("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/TaxParcel/AssessorsBasemap/MapServer/");
        map.addLayer(basemap);

        //apply a popup template to the parcels layer to format popup info 
        var popupTemplate = new esri.dijit.PopupTemplate({
          title: "{PARCELID}",
          fieldInfos: [{
            fieldName: "SITEADDRESS",
            label: 'Address:',
            visible: true
          }, {
            fieldName: "OWNERNME1",
            label: "Owner:",
            visible: true
          }]
        });



        //add the parcels layer to the map as a feature layer in selection mode we'll use this layer to query and display the selected parcels
        parcels = new esri.layers.FeatureLayer("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/TaxParcel/AssessorsBasemap/MapServer/1", {
          outFields: ["*"],
          infoTemplate: popupTemplate,
          mode: esri.layers.FeatureLayer.MODE_SELECTION
        });

        parcels.setSelectionSymbol(sfs);

        //when users click on the map select the parcel using the map point and update the url parameter
        dojo.connect(map, 'onClick', function (e) {
          var query = new esri.tasks.Query();
          query.geometry = e.mapPoint;
          var deferred = parcels.selectFeatures(query, esri.layers.FeatureLayer.SELECTION_NEW, function (selection) {
            //update the url param if a parcel was located
            if (selection.length > 0) {
              var parcelid = selection[0].attributes['PARCELID'];
              //Refresh the URL with the currently selected parcel
              if (typeof history.pushState !== 'undefined') {
                window.history.pushState(null, null, "?parcelid=" + selection[0].attributes.PARCELID);
              }
            }
          });
          map.infoWindow.setFeatures([deferred]);
          map.infoWindow.show(e.mapPoint);

        });



        dojo.connect(map, 'onLayersAddResult', function (result) {
          // Add a link into the InfoWindow Actions panel       
          var emailLink = dojo.create("a", {
            "class": "action",
            "innerHTML": "Email Map",
            "href": "javascript:void(0);"
          }, dojo.query(".actionList", map.infoWindow.domNode)[0]);


          // Register a function to be called when the user clicks on
          // the above link
          dojo.connect(emailLink, "onclick", function (evt) {
            var feature = map.infoWindow.getSelectedFeature();
            var url = window.location;
            var emailLink = "mailto:?subject=Parcel Map of :" + feature.attributes.PARCELID + "&body=Check out this map: %0D%0A " + window.location;
            window.location.href = emailLink;
          });

          //When users navigate through the history using the browser back/forward buttons select appropriate parcel  
          //https://developer.mozilla.org/en/DOM/Manipulating_the_browser_history
          window.onpopstate = function (event) {
            var parcelid = getParcelFromUrl(document.location.href);
            if (parcelid) {
              selectParcel(parcelid);
            } else {
              parcels.clearSelection();
              map.infoWindow.hide();
            }
          };

          //if a parcelid is specified in url param select that feature 
          var parcelid = getParcelFromUrl(document.location.href);
          selectParcel(parcelid);

        });

        map.addLayers([parcels]);



        dojo.connect(map, 'onLoad', function (theMap) {
          //resize the map when the browser resizes
          dojo.connect(dijit.byId('map'), 'resize', map, map.resize);
        });
      }

      //extract the parcel id from the url
      function getParcelFromUrl(url) {
        var urlObject = esri.urlToObject(url);
        if (urlObject.query && urlObject.query.parcelid) {
          return urlObject.query.parcelid;
        } else {
          return null;
        }
      }

      //select parcel from the feature layer by creating a query to look for the input parcel id 
      function selectParcel(parcelid) {
        if (parcelid) {
          var query = new esri.tasks.Query();
          query.where = "PARCELID = '" + parcelid + "'";
          var deferred = parcels.selectFeatures(query, esri.layers.FeatureLayer.SELECTION_NEW, function (selection) {
            var center = esri.graphicsExtent(selection).getCenter();
            var extHandler = dojo.connect(map, 'onExtentChange', function () {
              dojo.disconnect(extHandler);
              //zoom to the center then display the popup 
              map.infoWindow.setFeatures(selection);
              map.infoWindow.show(center);
            });
            map.centerAt(center);
          });

        }
function disablepopup() {
   map.infoWindow.hide();
   }
  
  <!--MEASUREMENT TOOLS-->
  var measurement = new esri.dijit.Measurement({
            map: map, onClick: disablepopup 
          },dojo.byId('measurementDiv'));
    measurement.startup()
  
  
  <!--DEACTIVATES MEASUREMENT TOOLS AFTER MEASUREMENT-->  
  dojo.connect(measurement, "onMeasureEnd", function(activeTool,geometry){
  this.setTool(activeTool, false), map.infoWindow.hide()
  });
      }
      dojo.addOnLoad(init);
    </script>  
  </head>  
  <body class="claro">  
  <!--CENTER and RIGHT CONTAINER-->  
  <div id="map" dojotype="dijit.layout.ContentPane" region="center" style="overflow:hidden;">
   </div>
      
   <div id="bottomPane" dojotype="dijit.layout.ContentPane" region="bottom"> 
   
  <!--MEASUREMENT TOOLS-->
  <div id="bottomPane" data-dojo-type="dijit.TitlePane" data-dojo-props="title:'Measurement Tools', closable:'false', open:'false'">
            <div id="measurementDiv"></div>
            <center><button dojoType="dijit.form.Button"  iconClass="eraserIcon" onclick="map.graphics.clear();">Clear Measurement</button></center>   
          </div>      
  </body> 
 
</html>


Thanks!!

Outcomes