Hello
I am new to ArcGIS JavaScript.
I'm using ArcGIS 10 and would like to publish results of a simple Query in a table.
This is my Code:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"> <title>Test QueryTask with Table</title> <link rel="stylesheet" href="http://js.arcgis.com/3.13/dijit/themes/tundra/tundra.css"> <link rel="stylesheet" href="http://js.arcgis.com/3.13/esri/css/esri.css"> <style> html, body { height: 100%; width: 100%; margin: 0; padding: 0; } </style> <script src="http://js.arcgis.com/3.13/"></script> <script> var queryTaskTwo, queryTWO; var grid, store; require([ "dojo/parser", "esri/tasks/query", "esri/tasks/QueryTask", "dijit/registry", "dojo/_base/array", "dojo/dom", "dojo/on", "dojo/_base/connect", "dojox/grid/DataGrid", "dojo/data/ItemFileReadStore", "dijit/form/Button", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!" ], function (parser, Query, QueryTask, registry, arrayUtils, dom, on, DataGrid, ItemFileReadStore) { parser.parse(); queryTaskTwo=new QueryTask("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Census_USA/MapServer/5") queryTWO=new Query(); queryTWO.returnGeometry=false; queryTWO.outFields=["STATE_NAME","POP00_SQMI","HOUSEHOLDS","BLACK","MALES"]; on(dom.byId("execute"), "click", execute); function execute () { queryTWO.text = dom.byId("stateName").value; queryTaskTwo.execute(queryTWO,showResultsTwo ); // } function showResultsTwo(resultsTwo) { //create array of attributes var items = arrayUtils.map(resultsTwo, function (result) { return result.feature.attributes; }); //Create data object to be used in store var data = { identifier : "SQMI", //This field needs to have unique values label : "SQMI", //Name field for display. Not pertinent to a grid but may be used elsewhere. items : items }; //Create data store and bind to grid. store = new ItemFileReadStore({ data : data }); var grid = dom.byId("grid"); grid.setStore(store); grid.setQuery({ SQMI: "*" }); // ................................................. } // }); </script> </head> <body class="tundra"> US state name : <input type="text" id="stateName" value="California"> <input id="execute" type="button" value="Get Details"> <br /> <br /> <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'bottom'" style="height:150px;"> <table data-dojo-type="dojox/grid/DataGrid" data-dojo-id="grid" id="grid" data-dojo-props="rowsPerPage:'5', rowSelector:'20px'"> <thead> <tr> <th field="SQMI" width="10%">SQMI</th> <th field="STATE_NAME" width="10%" >STATE_NAME1</th> <th field="POP00_SQMI" width="30%" >SUB_REGION2</th> <th field="HOUSEHOLDS" width="20%">AVG_SIZE97</th> <th field="BLACK" width="10%">BLACK </th> <th field="MALES" width="20%">OWNER_OCC</th> </tr> </thead> </table> </div> </html>
when I run this code, I get this error:
TypeError: undefined is not a function {stack: (...), message: "undefined is not a function"} "TypeError: undefined is not a function at showResultsTwo (http://localhost/Dgrid/queryMultipleTest2.html:74:16)I could not find what am I doing wrong?
Would it be possible to help?
Thanks
Abel
Solved! Go to Solution.
I have a made a few changes to your script and it's working as expected: JS Bin - Collaborative JavaScript Debugging
You have a problem with the agreement of the modules in your require statement and the variable in your function. You left out "connect" between on and DataGrid.
require([ "dojo/parser", "esri/tasks/query", "esri/tasks/QueryTask", "dijit/registry", "dojo/_base/array", "dojo/dom", "dojo/on", "dojo/_base/connect", "dojox/grid/DataGrid", "dojo/data/ItemFileReadStore", "dijit/form/Button", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!" ], function (parser, Query, QueryTask, registry, arrayUtils, dom, on, connect, DataGrid, ItemFileReadStore) {
Hello
Thank you Ken for answering
I must be missing something: I copied and pasted your code and error is still there?
Is using QueryTask appropriate in this case? In two samples I saw they are using FindTask ?
I appreciate your help.
Thanks
Abdul
I have a made a few changes to your script and it's working as expected: JS Bin - Collaborative JavaScript Debugging
Thank Ken.
I now know how important the way I import modules
Is there a way to learn about the order of requirements?
Thanks
Abel
This blog is a good primer on AMD (Asynchronous Module Definition). In addition to what it has to say about order of the modules in the require and the arguments in the function, you just have to remember that any modules that don't need an argument (like "dijit/form/Button" in your example) have to come after any modules that do need an argument. You can read more about AMD in Dojo here.
Thanks.
Much appreciated.
Abel