AnsweredAssumed Answered

registry.byId("search").on("click", myFunction) not working

Question asked by jbcbirder on Jul 11, 2014
Latest reply on Jul 17, 2014 by jbcbirder

I am attempting to merge this sample into an existing script where I am using the identify tool and making selections etc.

Show find task results in a DataGrid | ArcGIS API for JavaScript

https://developers.arcgis.com/javascript/jssamples/find_map_datagrid.html

The sample has a search for parcel functionality that is just what I want though I'm adapting it to search for roads in a street centerlines layer.

Chrome's javascript console tells me this which is one clue

Cannot read property 'on' of undefined

Where I'm getting this is on this line here

 

registry.byId("search").on("click", doFind);

 

Which is exactly how it is used in the sample. Here is how the "require" part starts out ... I also have a button control with the id "search" just as in the sample I linked to above (see html code posted below the require code). Can anyone see where I could be going wrong ?

 

when the line of code above registry.byId ... is NOT commented out, the html bit below goes away. When I comment it out, I see the search control and the table.

 

I also tried other methods to "connect" the click event to the search button but they don't work either. I have all the other code from the sample in there (such as the doFind function) which should run when the button is clicked.

 

Any ideas why this is not working ?

 

<code>

 

<script src="http://js.arcgis.com/3.9/"></script>
<script>
var findTask, findParams; // *
var map, center, zoom; // * center and zoom are new
var grid, store; // *
var identifyTask, identifyParams;  
require([
  "esri/map",
  "esri/dijit/BasemapGallery",
  "esri/dijit/Popup",
  "esri/layers/ArcGISDynamicMapServiceLayer",
  "esri/tasks/query",
  "esri/toolbars/draw",
  "esri/tasks/IdentifyTask",
  "esri/tasks/FindTask",
  "esri/tasks/FindParameters",
  "esri/layers/FeatureLayer",
  "esri/tasks/IdentifyResult",
  "esri/tasks/IdentifyParameters",
  "esri/dijit/InfoWindow",
  "esri/symbols/SimpleFillSymbol",
  "esri/symbols/SimpleLineSymbol",
  "esri/InfoTemplate",
  "dojo/_base/array",
  "dojo/_base/Color",
  "dojo/dom",
  "dojo/on",
  "dijit/registry",
  "dojo/parser",
  "dijit/layout/BorderContainer",
  "dijit/layout/ContentPane",
  "dijit/TitlePane",
  "dijit/form/Button",
  "dijit/form/RadioButton",
  // "dojo/parser",
  "dojo/domReady!"
  ], function(Map, BasemapGallery, Popup, ArcGISDynamicMapServiceLayer, Query, Draw, IdentifyTask, FindTask, FindParameters, FeatureLayer, IdentifyResult, IdentifyParameters, InfoWindow,
    SimpleFillSymbol, SimpleLineSymbol, InfoTemplate, arrayUtil, Color, dom, on, registry, parser, BorderContainer, ContentPane, TitlePane, Button, RadioButton) {
//setup the popup window
    parser.parse();
  
    // *
    registry.byId("search").on("click", doFind);
    // on(dom.byId("search"), "click", doFind);
    // mapOnLoad = dojo.connect("search", "click", doFind);

 

</code>

 

 

<code>

<div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'bottom'" style="height:190px;">
      <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'" style="height:30px; margin-top: 0;">
  Road name: <input type="text" id="ownerName" size="60" value="ROCK LODGE RD" />
      <button id="search" data-dojo-type="dijit.form.Button" type="button" data-dojo-attach-point="button" >Search 
      </button>
  </div>

 

<table data-dojo-type="dojox/grid/DataGrid" data-dojo-id="grid"  id="grid" data-dojo-props="rowsPerPage:'15', rowSelector:'20px'">
  <thead>
    <tr>
      <!--<th field="PARCELID">Parcel ID</th>-->
      <th field="STREET_ALL">NAME</th>
      <!--<th field="OWNERNME1" >Owner 1</th>-->
      <th width="120px" field="MAINTENANCE">MAINTENANCE</th>
      <!--<th field="OWNERNME2">Owner 2</th>-->
      <th field="FROM_LEFT_P" >FROM LEFT</th>
      <th field="TO_LEFT_P">TO LEFT</th>
      <th width="130px" field="FROM_RIGHT_P">FROM RIGHT</th>
      <th field="TO_RIGHT_P">TO RIGHT</th>
      <!--<th field="RESYRBLT ">Year Built</th>--?
      <!--<th field="SITEADDRESS" width="100%">Address</th>-->
    </tr>
  </thead>
</table>
</div>

</code>

 

Outcomes