Popup link query

65
4
Jump to solution
09-29-2022 07:32 AM
ITApplications
New Contributor III

Hello

I've created a popup and the link isn't working as expected. Hopefully it's a simple fix to something I've done wrong.

I'm creating a map where a user can click anywhere on the map and it will load a popup with a link to report fly tipping. When the user clicks the link it will open a webform and populate the x/y into the form.

Here is my code:

view.popup.autoOpenEnabled = false;
       view.on("click", (event) => {
       if (view.scale <= 3500) {
      const x = Math.round(event.mapPoint.x * 1) / 1;
      const y = Math.round(event.mapPoint.y * 1) / 1;
        
     view.popup.open({
     title:"Fly tip issue<br>",
     content:"<a href=\"https://https://east-riding-self.test.achieveservice.com/service/Fly_tipping_report" +"?Easting=" + x + "&Northing=" + y + "\" rel=\"nofollow ugc\">" +
			"<font size=\"6\">Click Here</font></a>",
      location: event.mapPoint
       });
       }
     });

 
The issue I'm having is that when you load the popup and click on the link it does nothing. I've checked the console and it returns 'refused to display 'https://east-riding-self.test.achieveservice.com/' in a frame because it set 'X-Frame-options to 'sameorigin'.

If I hover over the link it displays the webform URL fine and if I put the URL direct into my browser it also works fine:

ITApplications_0-1664461770041.png

 

Example: https://east-riding-self.test.achieveservice.com/service/Fly_tipping_report?Easting=501456&Northing=... 

I've got other maps with popup links to other forms on the same site and they work fine. Those popups however are linked to features and use custom content. Therefore it leads me to think I've constructed this pop up wrong and that's what's creating the error. Please advise.

Thanks

Ricky

0 Kudos
1 Solution

Accepted Solutions
SteveCole
Frequent Contributor

Have you tried adding target="_blank" to your HTML link? That will open the link in a new tab/window which might help you get around the CORS issue.

View solution in original post

4 Replies
SteveCole
Frequent Contributor

Have you tried adding target="_blank" to your HTML link? That will open the link in a new tab/window which might help you get around the CORS issue.

ITApplications
New Contributor III

Hi @SteveCole , that sounds promising, where would I add that in my HTML link please?

0 Kudos
SteveCole
Frequent Contributor

You would add it just like your use of "rel=nofollow" option. The order you drop it in doesn't matter- either drop it in before or after your "rel" option.

HTML A Reference.

0 Kudos
ITApplications
New Contributor III

That's fantastic, thanks @SteveCole that's worked perfectly! I'm still learning JS and HTML and that's really useful to know. Thanks again.