Select to view content in your preferred language

url parameter popup, and measure widget

9064
25
06-11-2012 12:43 PM
JohnBowdre
New Contributor
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!!
25 Replies
LisCollins
Deactivated User

Hi Kelly,

I just noticed that the code to turn off popups when the measurement button is on messes up my code for printing. It's no longer working. I'm either getting a time out error, or depending on what computer I'm using, I get this error in Firefox:Loading mixed (insecure) display content on a secure page.

Any ideas?

Code for printer in main.js file:

//for PRINTER ***********************
   if (this.config.enablePrintButton) {       //if the printing function is enabled true
   this._printer = new Print({                      //create a new printer widget called this._printer
   map: this.map, //the map to print
   templates: [{
  label: "Layout",   format: "PDF",   layout: "A3 Landscape",   layoutOptions: {
titleText: "Map",
  } }],
   url: "printing service URL here. just removed for now"//the url to export the web map task
   }, dom.byId("printButton"));   //html element where the print widget button/drop down will be rendered
   this._printer.startup();                 //finalize the creation of the widget
0 Kudos
ChrisSergent
Deactivated User

I'm not sure how busy Kelly Hutchins​ is, but she is presenting at the DevSummit this week. However, I imagine it would be helpful for her or someone else if you posted the complete modified code, which you can post here: JS Bin - Collaborative JavaScript Debugging  and then share that url. You also may want to consider starting a new thread. You can still tag Kelly by placing the @ symbol before her name if it doesn't appear in your list, you can type her name and just place an underscore where the space in her name is.

ChrisSergent
Deactivated User

I had an application where the infoWindow and the editor widget conflicted. It's appears to be similar to your issue. Check out my post on how I resolved the conflict. You may need to destroy your measurement tool and bring it back and possibly create button to start identifying features:

Adding an Editor to the Template

0 Kudos
StevenGraf1
Frequent Contributor

Here's how I am disabling Identify while measuring.

on(measurement, "tool-change", function(){
          map.setInfoWindowOnClick(false);
        })

  on(measurement, "measure-start", function(){
          map.setInfoWindowOnClick(false);
        })

  on(measurement, "unit-change", function(){
          map.setInfoWindowOnClick(false);
        })
        
        on(measurement, "measure-end", function(evt){ 
          //measurement.setTool("location", false); 
          map.setInfoWindowOnClick(true);
        })

The "unit-change" doesn't seem to work when the

showAdvancedUnits: true

constructor detail is on in ArcServer 10.3 though.

Hope this helps.

0 Kudos
StephenPatterson1
Occasional Contributor

I created my own Measure Widget and Annotation Widget with the version 4.5 API and am running into this same issue.  Is there a new way to disable popups with 4.0+ API when adding points with the SketchViewModel or Draw tool? 

I was able to disable popups for polygons and lines by using a click event and calling event.stopPropagation() while my tools are active, but it won't let me draw points or multipoints because it is a click event.  

The map.setInfoWindowOnClick() function from the 3.0 API does not seem to be in the latest API. 

0 Kudos
StephenPatterson1
Occasional Contributor

I figured out another way around the issue.  Our application calls the map hit tests and identify tasks from one function, so I set a boolean property to true while someone is using the widgets and set it back to false when finished.  I check for that property now when the map click event happens, which bypasses the popups. 

0 Kudos