Close button dissapear in javascript (InfoWindow)

[FranciscoCastillo1]

Hi,

I'm working with a script developed in ArcGIS 3.21 JavaScript API. When the PopUp is displayed as Info Template, the close button dissapear. I'm enclosing an image about this. The code is like this:

var startExtent = new esri.geometry.Extent(-13363107, 1593174, -9453107, 3922536, new esri.SpatialReference({ wkid: 102100 }));
 map.setExtent(startExtent);
 map.infoWindow.resize(400, 325);
var template = new esri.InfoTemplate();
 template.setTitle("${ESTADO}/${ACUIFERO}/${NOM_POZO}");
 template.setContent(getWindowContent);
 var statesLayer = new FeatureLayer("https://-----------", {
 mode: FeatureLayer.MODE_ONDEMAND,
 infoTemplate: template,
 outFields: ["*"]
 });‍‍‍‍‍‍‍‍‍‍‍

What should I include in the script or what is missing?

Thank you in advance and I hope someone could help me with this.

Best regards.

Francisco#

[RobertScheitlin__GISP]

Francisco,

   What css files are you including in your app?

[FranciscoCastillo1]

Hi, Robert.

Yes, I'm using this:

<link rel="stylesheet" href="https://js.arcgis.com/3.21/dijit/themes/claro/claro.css">
 <link rel="stylesheet" href="https://js.arcgis.com/3.21/esri/css/esri.css">‍‍

Besides, because of a formal rule here in my job, we need to attach a header/footer institutional that uses this:

<link href="https://framework-gb.cdn.gob.mx/assets/styles/main.css" rel="stylesheet" type="text/css">
 <script src="https://framework-gb.cdn.gob.mx/gobmx.js"></script>‍‍

Also a css file included in a local \styles folder:

@charset "UTF-8";
/* CSS Document */
html, body, #map {
 height: 100%;
 width: 100%;
 margin: 0;
 padding: 0;
 }
 .chart {
 width:200px;
 height:200px;
 padding:0px !important;
 }
 #info {
 width: 14.0625em;
 background-color: #000;
 color: #fff;
 position: absolute;
 left: 0;
 bottom: 0;
 padding-left: 10px;
 padding-top: 10px;
 font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
 border-top: 2px solid #ffffff;
 border-right: 2px solid #ffffff;
 border-top-right-radius: 20px;
 }‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

P.S. I realize when I turn on the CDN framework described above (

<link href="https://framework-gb.cdn.gob.mx/assets/styles/main.css" rel="stylesheet" type="text/css">
 <script src="https://framework-gb.cdn.gob.mx/gobmx.js"></script>‍‍

), the close button dissapear. How come?

Thank's for your attention and have a good day.

Best regards!

[RobertScheitlin__GISP]

Francisco,

  Sounds like that main.css has a rule that is overriding the popup. The only way to know is to inspect the dom element and see the css rules that are being applied for the close button.

[FranciscoCastillo1]

Thank you for the answer. We will checkt it out. However, I'm wonder if you could review our app and see the close button how displays when we apply de CDN framework. Maybe could help us to identify why happens that.

https://sigagis.conagua.gob.mx/rp/conagua1307.html 

Sincerely,

Francisco

[RobertScheitlin__GISP]

Sorry that url will not pull up for me.

[FranciscoCastillo1]

Ok, nevertheless, thank you and we will check the css as you recommend it.

One more thing: I've attached the js and the html files since you couldn't open the url above.

Thank you again.

Greetings!

De: Robert Scheitlin, GISP

Enviado el: jueves, 24 de enero de 2019 01:46 p.m.

- Re: Close button dissapear in javascript (InfoWindow)

GeoNet <https://community.esri.com/?et=watches.email.thread>

Re: Close button dissapear in javascript (InfoWindow)

reply from Robert Scheitlin, GISP<https://community.esri.com/people/rscheitlin?et=watches.email.thread> in ArcGIS API for JavaScript - View the full discussion<https://community.esri.com/message/827186-re-close-button-dissapear-in-javascript-infowindow?commentID=827186&et=watches.email.thread#comment-827186>

[GregMcNamee]

Same problem.

Adding this to my CSS fixed: 

.esriPopup .titleButton.close {

      display: block;

}