[OpenLayers-Users] Clicks on permalink control trigger clickout on vector layer

[Christoph Böhme]

Eric Lemoine <eric.lemoine at camptocamp.com> schrieb:

> On Saturday, November 14, 2009, Christoph Böhme <christoph at b3e.net>
> wrote:
> > Hi all,
> >
> > in my application [1] a vector layer with an number of features is
> > displayed on top of a base map. When users select one of the markers
> > the permalink will be updated to include the id of the selected
> > feature. This works all fine. The problem comes when users click on
> > the permalink. This click will not only activate the permalink but
> > also trigger a mouseout event on the vector layer which unselects
> > the current feature and updates the permalink. This happens before
> > the browser follows the link which makes it impossible to follow a
> > permalink with a selected feature.
> >
> > I tried to add an event listener to the permalink control in the
> > hope of catching and stopping the click event before it falls
> > through to the map. However, for some reason the event handler is
> > not called.
> >
> > This is the code I used for adding the event listener:
> >
> > this.permalink_control = new OpenLayers.Control.Permalink(null,
> > null, { eventListeners: {
> >         "click": function(e) {
> >                 alert("Test");
> >                 OpenLayers.Event.stop(e ? e: window.event);
> >         }
> > }});
> > this.map.addControl(this.permalink_control);
> > this.permalink_control.activate();
> >
> > Is this the correct way to add an event listener?
> 
> AFAIK you cannot register a browser event listener on a control's DOM
> element using eventListeners (or control.events.register).
> 
> Have you tried
> 
> OpenLayers.Event.observe(control.element, "click", function(e)
> { ... });
> 
> ?

Ah yes, this does the trick! Thanks a lot. 

Here is my actual solution in case someone has a similar problem. The
$$() function is part of prototype.js and allows me to address the a
element of the permalink easily:

OpenLayers.Event.observe(
  $$("." + this.permalink_control.displayClass + " a")[0],
  "click", function(evt) { 
     var e = evt ? evt : window.event;
     // "Follow" the link because the browser does not 
     // handle the click event anymore):
     location.href = OpenLayers.Event.element(e).href;
     // And stop the event from falling through to the map:
     OpenLayers.Event.stop(e);
     return false;
  }
);

Cheers,
Christoph