Getting an error when trying to do a query in esri-leaflet

[joepublic]

I am trying to created an app that when you click on a button at the top of the page will display only the countries that will satisfy the query attached to the button (see bottom of the file attached).

Here is the snippet of the code:

$('#NSM').click(function(){

     var buttonType = document.getElementById('NSM');

     countries.setWhere('type="'+ buttonType.value + '"');

});

I am using the "querying features #2" as my template.

The error I'm getting is

{"error":{"code":400,"message":"Unable to complete operation.","details":["Attribute column not found [Microsoft SQL Server Native Client 11.0: Invalid column name 'NSM'.] [MEP_global_data.DBO.test_bdry]"]}}

Any help would be appreciated

Thanks

[joepublic]

Hmmm...

I am running it on a esri webserver installed on an AWS virtual machine.

countries.addTo(map); <- placed outside the click function

$('#NSM').click(function(){

      var buttonType = document.getElementById('NSM')

      countries.setWhere("type like "+"'"+buttonType.value+"'");

});

The above "works" but it creates the a layer of ALL the countries BEFORE the setWhere works

see link: Add Map

But I want to create the layer only AFTER you click on the button with the countries that satisfies the query.

Chris

[PaulCrickard1]

Don't preload the layer. Load the basemap then add the layer using the where option - NOT the setWhere() method.

$('#NSM').click(function()

  {

  var buttonType = document.getElementById('NSM');

var countries = new L.esri.featureLayer(featureURL,

  {

  style: getStyle,

  onEachFeature: onEachFeature,

  where: "type like"+"'"+buttonType.value+"'"

  }).addTo(map);

});

If you will have lots of buttons, then make a function loadLayer() and pass the buttontype value. then you only need to add the code for the layer once.

[PaulCrickard1]

Loading the full layer is really slow on my machine. Preloading it is not making setWhere() and faster than if you just load the layer with where option onclick. I think loading using where is faster by a lot.

[joepublic]

Paul,

Your suggestions worked great!!

The new issue I have is with my mouseout:resetHighlight

resetHighlight(e){

     countries.resetStyle(e.target);

}

Is not recognizing the "countries" object since Iam now creating the instance inside of the click function.

[PaulCrickard1]

I think there is something wrong with the e.target - it is an object and you need to pass and ID to the resetStyle() method.

I added

var countries;

as the  first line after the <script> tag. Delete the var in the onclick button function.

Then where you have resetStyle(), I put this instead:

countries.setStyle(getStyle());

Works. Code is as simple as ResetStyle() because I am just recalling your original style function.

[joepublic]

Make countries a global variable worked

I do have multiple buttons and what to clear the countries from the

previous button click...

Any suggestions??

[PaulCrickard1]

Use map.removeLayer(). In each buttons function, before you add a layer, check to see if the other layers are on and turn them off if they are. then load your layer for the button.

if(map.hasLayer(countries)){

                 map.removeLayer(countries);

                 countriesABC = new L.esri.featureLayer(featureURL-ABC, { style: getStyle, onEachFeature: onEachFeature,where: "type                                              like"+"'"+buttonType.value+"'"

                                               }).addTo(map);

}

else {alert("aint got it");}

[joepublic]

Paul,

Everything looks good!!

Thanks for the help!!

Chris