connect query to click event

Question

I have a value that is passed to a query, and a button that will execute the search function. The click event doesn't seem to work. The query works, but it's supposed to run once the button is clicked, and not on map load.

This question Set definition expression from click event is a bit similiar to my problem, except my query displays.

I was trying to have the user inputted value pass to the query, and run the query when the button is clicked. I don't want to select features, I only want to show a subset of the layer.

Here is my working code:

......

Answer 1

if you open the browser developer tools, you can see that the line of code below is throwing an error in the console.

dom.byId('execute').on("click", search());
>>Uncaught TypeError: undefined is not a function

after adding a reference to "dojo/on", a suitable replacement would be

on(dom.byId("execute"), "click", search);

the reason for this is that your button is a plain old DOM node, (not an evented JavaScript object). see the SitePen doc here for more information.

Answer 2

You're not passing in a callback function into your selectFeatures function.

You need to set it up like:

function search(){
    var queryTask = new QueryTask("https://services1.arcgis.com/SIYkiqjmENweC50g/arcgis/rest/services/Connectory/FeatureServer/0");
     var query = new esri.tasks.Query();
     //var value = dom.byId('company').value;
     query.returnGeometry = true ;
     query.outFields = ["*"];
     console.log('Selection Query: ' + query.outFields)
     query.where = "companyname LIKE '" + '%' + dom.byId("company").value + '%' + "'";
     queryTask.execute(query);
     console.log('Query Registered');
     industryLayer10.selectFeatures(query, null, selectFinished, null);
     //I am not doing anything with selection method because you can clear the 
     //the selected features later..  you can do whatever you'd like though
     //the 3rd parameter is a function that you can
     //use to handle the response from the server
     //if you loaded all the features from the feature layer, you could avoid calling
     //the server but that has its own limitations and slowdowns
     //also the 2nd null is another call back for errors



     console.log('Selection Query: ' + query.where);

map.addLayers([industryLayer10]);
     }

function selectFinished(response){
//do whatever you need to with your response
//the response will be an object and you can dig into the attributes or geometry to get
//the features it returns.  Then you can make your temp layer and add it into map
}

Hopefully that makes sense. You can't directly handle the selection because it is sending an AJAX request to your server where the data gets queried. Once your server has prepared and sent back the requested information, you can then process it. Many of ESRI's API functions include parameters for a callback function to handle the return from the server.

For more info on selecting features from a feature layer, look at The documentation for selectFeatures

Also, there is a typo (extra comma) on line 79 where you didn't remove it when you commented out the infoTemplate and id.