topic Re: Map.on key-down & key-up not working in IE 10? in ArcGIS JavaScript Maps SDK Questions

Map.on key-down & key-up not working in IE 10?

DominickCisson — Thu, 05 Sep 2013 15:39:14 GMT

I believe the map.on events "key-down" and key-up" are not functioning in Internet Exporter 10. Has anyone else experienced this issue?

Below is a very simple modified ESRI sample that highlights this problem. Run it in anything but IE 10 and the key-down event fires.

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=7, IE=9, IE=10">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>
    <title>Simple Map</title>
    <link rel="stylesheet" href="http://js.arcgis.com/3.6/js/esri/css/esri.css">
    <style>
      html, body, #map {
        height: 100%;
        width: 100%;
        margin: 0;
        padding: 0;
      }
      body {
        background-color: #FFF;
        overflow: hidden;
        font-family: "Trebuchet MS";
      }
    </style>
    <script src="http://js.arcgis.com/3.6/"></script>
    <script>
      var map;

      require(["esri/map", "dojo/domReady!"], function(Map) {
        map = new Map("map", {
          basemap: "topo",
          center: [-122.45,37.75], // long, lat
          zoom: 13,
          sliderStyle: "small"
        });
        map.on("key-down",function(){console.log("Down!")});
      });
    </script>
  </head>

  <body>
    <div id="map"></div>
  </body>
</html>

Re: Map.on key-down & key-up not working in IE 10?

ChrisJudd1 — Fri, 08 Nov 2013 13:23:00 GMT

I can confirm this is still an issue on in the 3.7 version of the api and manifests itself on only with the key-up and key-down events but also in the tools that depend on key-up and key-down like snapping: https://developers.arcgis.com/en/javascript/jssamples/widget_measurement.html

Is there anything that folks are doing to get around this issue for IE 10?

Re: Map.on key-down & key-up not working in IE 10?

ReneRubalcava — Sat, 11 Dec 2021 18:21:57 GMT

I haven't tried this with IE10 yet, but it worked in IE9, you might be able to do it like this.

// using the container div
map.container.onkeydown = function(e) {
 console.log("container: native listen down", e);
};
map.container.onkeyup = function(e) {
 console.log("container: native listen up", e);
};

// using the root div
map.root.onkeydown = function(e) {
 console.log("root: native listen down", e);
};
map.root.onkeyup = function(e) {
 console.log("root: native listen up", e);
};

However this is only works on the map in IE on my end, it didn't work in Chrome for me, so mileage may vary.

Re: Map.on key-down & key-up not working in IE 10?

ChrisJudd1 — Sat, 11 Dec 2021 18:22:00 GMT

Thanks, Rene, but unfortunately this did not work with IE 10...

I haven't tried this with IE10 yet, but it worked in IE9, you might be able to do it like this.
// using the container div
map.container.onkeydown = function(e) {
 console.log("container: native listen down", e);
};
map.container.onkeyup = function(e) {
 console.log("container: native listen up", e);
};

// using the root div
map.root.onkeydown = function(e) {
 console.log("root: native listen down", e);
};
map.root.onkeyup = function(e) {
 console.log("root: native listen up", e);
};
However this is only works on the map in IE on my end, it didn't work in Chrome for me, so mileage may vary.