Non-Clickable URL Links in ArcGIS Online Popups with Attribute Expressions

[ŁukaszMacieja]

Hello. 

I have encountered an issue while configuring a popup window in ArcGIS Online, where my main goal is to hide empty rows and enable users to click on URL links. Below, I outline the steps I've taken and the problems I've encountered:

1. **Without Attribute-Based Expressions:**
- Initially, I wanted to hide empty rows in the popup window. Unfortunately, I was not able to achieve this. As a result, the popup window displays all attributes, regardless of whether they have a value or not.

2. **With Attribute-Based Expressions:**
- I decided to use Attribute-Based Expressions to display only those rows that are not empty. This solution worked correctly and now the empty rows are hidden.

3. **Issue with URL Links:**
- After applying Attribute-Based Expressions, the URL links are not active. Unlike the standard display where links are clickable, in the popup with attribute expressions, links appear as plain text, preventing users from interacting with them.

4. **With Custom Attribute Display:**
- Finally, I attempted to use the Custom Attribute Display to format the popup window. While this method allowed me to hide empty rows, it also resulted in non-clickable links, similar to the issue encountered with attribute expressions.

I am attaching screenshots that present the described issues:
- Screenshot 1: Popup window without Attribute-Based Expressions, where links are active, but empty rows are displayed.
- Screenshot 2: Popup window with Attribute-Based Expressions, where empty rows are hidden, but links are not clickable.
- Screenshot 3: Popup window with Custom Attribute Display, where empty rows are hidden, but again, links are not clickable.

Could you please assist me in resolving these issues, especially to make the URL links clickable in the popup window with Attribute-Based Expressions and Custom Attribute Display?

thanks in advance for your assistance

[ŁukaszMacieja]

---

arcade code I used for screen 2

var info = '';

// Sprawdź każdą kolumnę i dodaj jej wartość, jeśli nie jest pusta lub nie zawiera tylko spacji
function addToInfo(value, columnName) {
if (value != null && value != '' && Trim(value) != '') {
info += columnName + ': ' + value + TextFormatting.NewLine;
}
}

// Dodaj dane z każdej kolumny, jeśli nie są puste i nie zawierają tylko spacji
addToInfo($feature.gmina, 'Gmina');
addToInfo($feature.pow, 'Powierzchnia');
addToInfo($feature.pr_do_zain, 'Produkcja do zainwestowania');
addToInfo($feature.COI, 'COI');
addToInfo($feature.COI2, 'COI2');
addToInfo($feature.COI3, 'COI3');
addToInfo($feature.COI4, 'COI4');
addToInfo($feature.COI5, 'COI5');
addToInfo($feature.COI6, 'COI6');
addToInfo($feature.COI7, 'COI7');
addToInfo($feature.COI8, 'COI8');
addToInfo($feature.COI9, 'COI9');
addToInfo($feature.PAIH, 'PAIH');
addToInfo($feature.PAIH2, 'PAIH2');
addToInfo($feature.PAIH3, 'PAIH3');
addToInfo($feature.PAIH4, 'PAIH4');
addToInfo($feature.PAIH5, 'PAIH5');
addToInfo($feature.PAIH6, 'PAIH6');
addToInfo($feature.PAIH7, 'PAIH7');
addToInfo($feature.PAIH8, 'PAIH8');
addToInfo($feature.PAIH9, 'PAIH9');
addToInfo($feature.PSSE, 'PSSE');
addToInfo($feature.PSSE2, 'PSSE2');
addToInfo($feature.PSSE3, 'PSSE3');
addToInfo($feature.PSSE4, 'PSSE4');
addToInfo($feature.PSSE5, 'PSSE5');
addToInfo($feature.PSSE6, 'PSSE6');
addToInfo($feature.PSSE7, 'PSSE7');

return info;

[jcarlson]

HTML tags in expressions don't work with popups very well.

What you should do instead is use an Arcade popup element.

https://www.esri.com/arcgis-blog/products/arcgis-online/mapping/part-1-introducing-arcade-pop-up-con...

You can write an expression that will skip null attributes, and HTML tags are rendered in the output, so <a href="...">Link</a> will actually show up as a clickable link.

[ŁukaszMacieja]

ok, I created such a code, because I had already found the page you provided

and it works perfectly because it gives these values to the links but in the table in the dashboard, also given is displayed
and the code I made based on this and it works

var info = '';

function addToInfo(value, columnName) {
if (value != null && value != '') {
info += '<a href="' + value + '">' + columnName + '</a>' + TextFormatting.NewLine;
}
}

// Dodaj dane z każdej kolumny, jeśli nie są puste
addToInfo($feature.COI, 'COI');
addToInfo($feature.COI2, 'COI2');
addToInfo($feature.COI3, 'COI3');
addToInfo($feature.COI4, 'COI4');
addToInfo($feature.COI5, 'COI5');
addToInfo($feature.COI6, 'COI6');
addToInfo($feature.COI7, 'COI7');
addToInfo($feature.COI8, 'COI8');
addToInfo($feature.COI9, 'COI9');
addToInfo($feature.PAIH, 'PAIH');
addToInfo($feature.PAIH2, 'PAIH2');
addToInfo($feature.PAIH3, 'PAIH3');
addToInfo($feature.PAIH4, 'PAIH4');
addToInfo($feature.PAIH5, 'PAIH5');
addToInfo($feature.PAIH6, 'PAIH6');
addToInfo($feature.PAIH7, 'PAIH7');
addToInfo($feature.PAIH8, 'PAIH8');
addToInfo($feature.PAIH9, 'PAIH9');
addToInfo($feature.PSSE, 'PSSE');
addToInfo($feature.PSSE2, 'PSSE2');
addToInfo($feature.PSSE3, 'PSSE3');
addToInfo($feature.PSSE4, 'PSSE4');
addToInfo($feature.PSSE5, 'PSSE5');
addToInfo($feature.PSSE6, 'PSSE6');
addToInfo($feature.PSSE7, 'PSSE7');

return info;