Open a Outsystems popup from a Google maps marker infowindow (Web)

Open a Outsystems popup from a Google maps marker infowindow (Web)

  

Hi all,

I have some trouble opening a popup from a Google maps marker.

On a page I have a Google map with markers. These markers are placed based on data from a Outsystems table with latitude, longitude and a name. To each marker an infowindow is linked. When clicked on a marker the infowindow is shown with the name in it.

So far, so good.

Next, I want to link the name in the infowindow to a Outsystems popup. It’s a popup that I use also in an other page. When I click the link in the infowindow I want to open the popup with corresponding data of the marker.

The map is a webblock in another eSpace with the JavaScript in it to create the map and place the markers. I don’t use the Forge component, because of other specific custom functionality.

 I tried with an External Site element with a dynamic URL:

The problem is that the link is generated in the Google map JavaScript and that I don’t know the Identifier of that link to use in the property “LinkOrButtonWidgetId” of the popup editor at design time.

 I did a test with just hard coding the popup editor (i.e. looked in the page what’s generated for a popup) by putting as an expression in the main page, like:

"<span id='DynamicPopup_block'>/span>
<script type='text/javascript'>
RichWidgets_Popup_Editor_init('DynamicPopup', 'DynamicPopup_block', 'Change location details', -1, 600, 'https://<SomeEnvironment>/ModifyLocationPopup.aspx? LocationId=1234&DetailId=101', true, true, false, false);
</script>"

then also hard coded the corresponding link in the infowindow, which is in the JavaScript of the webblock:

...

infowindow.setContent('<a id="DynamicPopup" href="https://...">Midden</a>');

...

There must be something missing or wrong, because the popup is opened as a new page and not as a popup.

I wonder if anyone can help with an elegant(?) solution for his.

Thanks,

Menno

Solution

Hi, 

PopupEditor needs more than just this function to work.
I think that an easier approach is to use a hidden link associated with the popup editor. And JavaScript to execute the link.

I attached a simple example (not using maps) to you to adapt.

Cheers,
Eduardo Jauch

Solution

Hi Eduardo,

That worked perfectly! 

Thanks.

Menno