i have two on layer click events.
scenario is two show two infotemplates when on layer1 is clicked
when on "A" layer is clicked "B" layer is not fired initially
when i click on "B" layer it is working(area code details information)
now code related to "B" is registered after clicking on it, initially on page load evt it was not registered i guess
Again if i click on "A" layer now both events works(initially it doesn't)
Any suggestions
Thanks
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
<title>Non graphic info window</title>
<link rel="stylesheet" href="https://js.arcgis.com/3.27/esri/css/esri.css">
<style>
html, body, #map{
height: 100%;
margin: 0;
padding: 0;
}
</style>
<script src="https://js.arcgis.com/3.27/"></script>
<script>
var map;
require([
"esri/map","esri/dijit/PopupTemplate", "esri/layers/FeatureLayer","esri/InfoTemplate","esri/dijit/Popup",
"dojo/domReady!"
], function(
Map,PopupTemplate,FeatureLayer,InfoTemplate,PopupMobile
){
var service1 = "http://bbb.aaaaa.com/arcgis03/rest/services/aaaa/bbbb/FeatureServer/0";
var service2 = "http://bbb.aaaaa.com/arcgis03/rest/services/sbc/Territorry/MapServer/2";
var popup = new PopupMobile(null, dojo.create("div"));
var Ginfotemplate = InfoTemplate;
map = new Map("map", {
basemap: "topo",
infoWindow: popup,
center: [-87.6298, 41.8781],
zoom: 13
});
var popupTemplate = new PopupTemplate({
content: content1
});
var popupTemplate2 = new PopupTemplate({
content: content2
});
var layer1 = new FeatureLayer(service1, {
mode: FeatureLayer.MODE_AUTO,
infoTemplate: popupTemplate,
outFields: ["*"],
"opacity": 0.9
});
var Glayer1 = layer1;
var layer2 = new FeatureLayer(service2, {
mode: FeatureLayer.MODE_SNAPSHOT,
infoTemplate: popupTemplate2,
outFields: ["*"],
"opacity": 0.5
});
var Glayer2 = layer2;
map.addLayers([layer2,layer1]);
layer1.on("click", function (evt) {
var idProperty = layer1.objectIdField,
feature,
featureId,
query;
if (evt.graphic && evt.graphic.attributes && evt.graphic.attributes[idProperty]) {
feature = evt.graphic,
featureId = feature.attributes[idProperty];
Glayer1.infoTemplate = new Ginfotemplate("Title1" , content1);
popup.show(evt.mapPoint);
}
});
layer2.on("click", function (evt) {
var idProperty2 = layer2.objectIdField,
feature,
featureId,
query;
if (evt.graphic && evt.graphic.attributes && evt.graphic.attributes[idProperty2]) {
feature = evt.graphic,
featureId = feature.attributes[idProperty2];
Glayer2.infoTemplate = new Ginfotemplate("Title2", content2);
popup.show(evt.mapPoint);
}
});
});
</script>
</head>
<body>
<script>
var content1 = "<table class='table'><tr><td>Field1</td><td>${Field1}</td></tr>" +
"</table>";
var content2 = "<table class='table'><tr><td>Teritory</td><td><strong>${Field2}</strong></td></tr>" +
"</table>";
</script>
<div id="map"></div>
</body>
</html>