We are using "esri/InfoTemplate" to show infowindow for the Graphics.
And when we are setting any Node (element) as the content for infoTemplate we can see the infowindow properly only for first time , however next time onward when we click on same graphic the blank infowindow is shown.
Following are our observations:
Infowindow content when graphic is clicked for first time:
Infowindow content when same graphic is clicked for second time:
Below is the code Sample:
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <!--The viewport meta tag is used to improve the presentation and behavior of the samples on iOS devices--> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"> <title>Graphic InfoTemplate sample</title> <link rel="stylesheet" href="http://js.arcgis.com/3.13/esri/css/esri.css"> <style> html, body, #mapDiv { padding: 0; margin: 0; height: 100%; } button { display: block; } </style> <script src="http://js.arcgis.com/3.13/"></script> <script> var map; require([ "esri/map", "esri/symbols/SimpleMarkerSymbol", "esri/InfoTemplate", "esri/graphic", "esri/Color", "dojo/dom", "dojo/dom-construct", "dojo/on", "dojo/domReady!" ], function ( Map, SimpleMarkerSymbol, InfoTemplate, Graphic, Color, dom, domConstruct, on ) { //create symbol for graphic var markerSymbol = new SimpleMarkerSymbol(); markerSymbol.setPath("M16,4.938c-7.732,0-14,4.701-14,10.5c0,1.981,0.741,3.833,2.016,5.414L2,25.272l5.613-1.44c2.339,1.316,5.237,2.106,8.387,2.106c7.732,0,14-4.701,14-10.5S23.732,4.938,16,4.938zM16.868,21.375h-1.969v-1.889h1.969V21.375zM16.772,18.094h-1.777l-0.176-8.083h2.113L16.772,18.094z"); markerSymbol.setColor(new Color("#00FFFF")); var count = 1;//by default set graphic count to 1 //create map map = new Map("mapDiv", { basemap: "streets", center: [-25.312, 34.307], zoom: 3}); map.on("click", addGraphic); function addGraphic(evt) { var graphic, infoTemplate, templateDiv, templateButton; if (evt.graphic) { //display infowindow if graphic is clicked. map.infoWindow.show(); } else { //create new graphic graphic = new Graphic(evt.mapPoint, markerSymbol); //create info template for graphic infoTemplate = new InfoTemplate(); infoTemplate.setTitle("Graphic " + count); //create template containing DOM node templateDiv = domConstruct.create("div", { "style": "background-color:grey; color:white; height:60px", 'innerHTML': "Graphic " + count }, null); templateButton = domConstruct.create("button", { 'innerHTML': "Button for Graphic " + count }, templateDiv); //set Content infoTemplate.setContent(templateDiv); //set infoTemplate to graphic graphic.setInfoTemplate(infoTemplate); //Add Graphics on map map.graphics.add(graphic); count++; } } }); </script> </head> <body> <div id="mapDiv"> </div> </body> </html>
Steps to reproduce:
1.Click on map to add the graphics.
2.Now click on the graphic. (observe that you will see the text "Graphic 1" and a Button) :
3. Close the infowindow
4.Now click on the same graphic again. (observe that you will not see the text and Button) :
This is reproducible only in IE.
Sumit,
Sorry I missed that part.
Hey sumit zarkar,
I know it is looks like bad development, but I feel its the normal way when dealing with IE!
I made some modifications on this part. So I re-create the content of InfoWindow which works fine.
if (evt.graphic) { infoTemplate = new InfoTemplate(); var currentTitle = evt.graphic.infoTemplate.title; infoTemplate.setTitle(currentTitle); templateDiv = domConstruct.create("div", { "style" : "background-color:grey; color:white; height:60px", 'innerHTML' : currentTitle }, null); templateButton = domConstruct.create("button", { 'innerHTML' : "Button for " + currentTitle }, templateDiv); infoTemplate.setContent(templateDiv); evt.graphic.setInfoTemplate(infoTemplate); map.infoWindow.show(); }
Hope this help you.
Regards,
Yusuf
Yusuf Ali this will only work if we click on the graphic again.
however it will not work when multiple feature are shown in infowindow and when we traverse to next feature and again traverse back to the first feature.
Hi Sumit,
Did you find a work around to this problem?
I am having the exact same issue as you describe.
Any ideas are appreciated.
Jill