I have a OpenLayers, Mapfish, GeoServer map on a webpage. I am using OpenLayers.Popup and getFeaturesInfo to get the attributes from GeoServer (2.1.3).

I have several wms layers with markers and text labels. The problem is that suddenly the the markers do not react to click. There is no action in FireBug at all. If I refresh the page and start all over again I can get click events on the markers. This is very unstable and since I get no js error in Firebug it is not easy to tell what happens.

It just seems to lose the click event. Is there anything here in the code that could be done better? I am using a ExtJS lightbox plugin inside the popup.

         info = new OpenLayers.Control.WMSGetFeatureInfo({
                url: 'http://kart.naturkart.no/geoserver/wms',
                title: 'Identify features by clicking',
                queryVisible: true,
                eventListeners: {
                    getfeatureinfo: function(event) {
                        if (popup) {
                        var contentHtml = '';
                        // Manage the features
                        if (event.features.length > 0) {
                            for (var i = 0; i < event.features.length; i++) {
                                var feature = event.features[i];
                                // Identify the type
                                if (feature.gml.featureType == 'Architect_1' || feature.gml.featureType == 'Architect_2') {
                                    // Create HTML content for this feature type
                                    var gardsnavn = feature.attributes['gardsnavn'];
                                    var navn = feature.attributes['navn'];
                                    var epost = feature.attributes['epost'];
                                    var lokalitetsid = feature.attributes['lokalitetsid'];
                                    var x = feature.attributes['eu8933x'];
                                    var y = feature.attributes['eu8933y']; 
                                    if (gardsnavn === null) {
                                        gardsnavn = '';
                                    if (navn === null) {
                                        navn = '';
                                    contentHtml = contentHtml + '<h2>' + feature.attributes['art'] + '</h2>';
                                    contentHtml = contentHtml + gardsnavn + ' | ' + navn + '<br/>';
                                    if (feature.attributes['bilde']>0){
                                    var imgcount = feature.attributes['bilde'];
                                    var lokalitetsid = feature.attributes['lokalitetsid'];
                                    var i=0;
                                    for (i=1;i<=imgcount;i++){
                                    contentHtml = contentHtml + '<a class="group" rel="lightbox" href="Eksport/images/512/'+ lokalitetsid +'-'+i+'.jpg" /><img src="Eksport/images/80/'+ lokalitetsid +'-'+i+'.jpg" /></a>&nbsp;';
                                    contentHtml = contentHtml + '<span class="lesPDF">Les <a href="' + feature.attributes['urltilpdfark'] + '" target="_blank">mer</a> om dette minne.</span>';
                                    contentHtml = contentHtml + '<span class="popItem"><a href="http://architectsite.no/telemark/?x='+feature.attributes['eu8933x']+'&amp;y='+feature.attributes['eu8933y']+'">Direkte link</a> til dette minne.</span>';
                                    contentHtml = contentHtml + '<span class="sendMail"><a href="mailto:' +epost+ '?subject=Tilleggsopplysninger om minnenr. '+lokalitetsid+'&body=Direkte link til minne:http://architectsite.no/telemark/?x='+ x +'&y='+ y +'Opplysninger: ">Meld inn</a> opplysninger om dette eller andre minner.</span><br/>';}
                                 else if (feature.gml.featureType == 'gamlenavn_archi') {
                                        var navn = feature.attributes['navn'];
                                        var kommentar = (feature.attributes['kommentar'] === null?'':feature.attributes['kommentar']);
                                        var x = feature.attributes['eu8933x'];
                                        var y = feature.attributes['eu8933y'];
                                        contentHtml = '<h2>'+ navn + '</h2>'; 
                                        contentHtml = contentHtml + kommentar + '<br />';
                   contentHtml = contentHtml + '<span class="popItem"><a href="http://architectsite.no/telemark/?x='+x+'&amp;y='+y+'">Direkte link</a> til dette stedsnavn.</span>';                    

                        } else {
                            // Doesn't show any popup if no features.
                        var popup = new Popup(
                        popup.autoSize = true;
                        map.addPopup(popup, true);

1 Answer 1


as i understand from the codes and your explanation, it's come to my mind:

in OpenLayers.Popup method, there is a parameter which name is closeBox. this works for:

{Boolean} Whether to display a close box inside the popup.

if you make it true, the closing button will show in popup, in this case when you click to closing box, it is going to destroy all feature from map which is irreversible for this popup.

 destroy: function()

 nullify references to prevent circular references and memory leaks


make it hidden or unselect for second call.

you can achieve this sth. as:

function onPopupClose(evt) {

   function onFeatureSelect(feature) {
            selectedFeature = feature;
            popup = new OpenLayers.Popup.FramedCloud("chicken", 
                                     "<div style='font-size:.8em'>Feature: " + feature.id 
            +"<br>Area: " + feature.geometry.getArea()+"</div>",
                                     null, true, onPopupClose);
            feature.popup = popup;

i hope it helps you...

  • Thanks for helping. So you think that closing the popup destroys the popup listener completely and that is why I have to reload the page? It is strange that this happens only sometimes. It seems that zooming and panning in between makes this happen. If I only select a marker it always shows the popup on first try and later if I do not zoom the map but just pick other markers.
    – asle
    May 14, 2012 at 8:02
  • as i sad, first clicking on a marker opened its popup, then if you clicked close button it destroyed popup.. but you didnt use close button and selected other marker, it would be opened the popop...and zoom in - out renews feature attributes of markers..
    – urcm
    May 14, 2012 at 8:51
  • Thanks. Forgive me if I misunderstand. But I thought that this in my code would destroy other popups when I click on a new marker: if (popup) { map.removePopup(popup); }
    – asle
    May 14, 2012 at 9:44
  • I found out also that the features text sometimes contained bogus text and that javascript stalled on that. When I cleaned up the text in the database it seems to work every time. Thanks for helping!
    – asle
    May 24, 2012 at 14:01

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.