No background on infoWindow

JasonMiller1 · ‎04-24-2013

I'm working on an application that requires that the infoWindow pop ups work outside of the map as well as inside. I have the pop up working, but for some reason there is no background, just text.
I've created an infoWindow object like this:

<div data-dojo-id="infowindow" 
data-dojo-type="esri.dijit.InfoWindow" ></div>

Once I get the data I need from my database, I do this:

infowindow.setTitle("Milepost Summary");
infowindow.setContent(milepostEntityResults.innerHTML);

I then do an infowindow.show to make it pop up. This all works, but when I get my pop up, it's just text, no background. If I change my code back to the way it was before I had the requirement of pop-ups outside of the map, everything looks fine. This is by creating the infoTemplate, adding it to the graphic and triggering it that way. However, I can't take this infoWindow outside of the map.

Does anyone know what might cause this?

DianaBenedict · ‎04-25-2013

I'm working on an application that requires that the infoWindow pop ups work outside of the map as well as inside. I have the pop up working, but for some reason there is no background, just text.
I've created an infoWindow object like this:
<div data-dojo-id="infowindow" 
data-dojo-type="esri.dijit.InfoWindow" ></div>
Once I get the data I need from my database, I do this:
infowindow.setTitle("Milepost Summary");
infowindow.setContent(milepostEntityResults.innerHTML);
I then do an infowindow.show to make it pop up. This all works, but when I get my pop up, it's just text, no background. If I change my code back to the way it was before I had the requirement of pop-ups outside of the map, everything looks fine. This is by creating the infoTemplate, adding it to the graphic and triggering it that way. However, I can't take this infoWindow outside of the map.

Does anyone know what might cause this?

I am assuming it has to do with your css. When you create an infowindow the "esri" way, it must add a class that tells it how to display. If I were you, I would first go back to the way that it displays correctly and figure out what class(s) have been applied. Then you can go back to your HTML code and add that class to your code. Otherwise, you will need to create your own CSS to handle this.

Not sure what version of IE you have but if you happen to be using IE 9 you can do the following
1) hit F12 (tools-->developer tools)
2) select the html tab on top right
3) open your attribute inspector
4) select the "select element.." button that looks like a cursor arrow
5) click on the "background" element of your attribute inspector
6) you will see all the CSS that is associated with this element
7) take some time and eval what you have and I think it will point you to what you need.

Good Luck!

JasonMiller1 · ‎04-26-2013

I figured this out, so silly. We recently migrated our JSF application that the uses the map from one JSF framework to the other. When we did that, someone removed the class that was added to the <body> tag. I added that back in and now it's working.

It's always the small things.