Popup link query

[ITApplications]

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:

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

[SteveCole · Accepted solution]

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]

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

[SteveCole]

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.

[ITApplications]

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.