[GIS] Cannot read property ‘on’ of undefined

arcgis-javascript-apiarcgis-server

while clicking on the button on.click event is not fired and getting error "Cannot read property 'on' of undefined",how to solve this issue.

Simple Map

html, body, #map {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
}
body {
background-color: #FFF;
overflow: hidden;
font-family: "Trebuchet MS";
}

var map,navToolbar;

  require(["esri/map",
           "dojo/dom",
           "dojo/on",
           "dijit/form/Button",
           "dojo/domReady!"], function(Map,dom,on,parser,registry) {
      map = new Map("map", {
      basemap: "streets",  
      center: [72, 25.75], 
      zoom: 5
    });
    //navToolbar = new Navigation(map);
      //on(navToolbar, "onExtentHistoryChange", extentHistoryChangeHandler);

    dijit.registry.byId("clickMe").on("click",showMessage);
    function showMessage(){
     alert("Hello")
    }       
});

</script>

Click Me

Best Answer

you are missing several modules in your require() call, so the mapping of the aliases in your callback are incorrect.

require([
  "esri/map",
  "dojo/dom",
  "dojo/on",
  "dojo/parser", // < this one
  "dijit/registry", // < and this one
  "dijit/form/Button",
  "dojo/domReady!"], function(Map, dom, on, parser, registry, Button) {

afterwards, you need to use your alias when you call on and ensure the corresponding <div> is present.

registry.byId("clickMe").on("click",showMessage);
// ...
<div id="clickMe"></div>

see this old blog of mine for more information.

related threads

Related Question