nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Link not displaying in conditional field display

JaredPilbeam1

Thanks to this recent blog post: https://community.esri.com/community/gis/web-gis/arcgisonline/blog/2017/07/18/conditional-field-display-with-arcade-in-pop-ups

I have a bunch of points on my web map that are tourist attractions. Some have websites available, some do not. But, they're all in the same attribute table. I have a "URL" field, and when relevant there's a url to the website. This is where the post came in handy. I was able to copy the conditional Arcade line and HTML code that I tailored to my app.

The only thing is that my attribute field is dealing with a link. It's currently showing up as text on the pop-up (visible in the background here). It doesn't seem to be a case of using the link tool in the Custom Attribute Display window because most are individual links. Would you have an idea how to configure it so the link is live?

Encuentra más publicaciones etiquetadas con

Accepted answers

JaredPilbeam1

Hi Robert,

After talking with Esri, I found out there was an existing bug behind this behavior:

BUG-000106245: When using a custom attribute display pop-up with a hyperlink field, null values in the hyperlink field result in a link to the current web map.

This was supposedly fixed at the latest release of AGOL they say. The behavior I'm experiencing with the text appearing in the pop-up for fields with null values, even though the Arcade expression tells it otherwise is a new defect. So, they're looking into it. It sounds like, once treated, the URL field will display the hyperlink when present and nothing when the field's null, thereby eliminating the need for the Arcade expression.

All comments

Anonymous User

So I had a similar problem in my web map as I only wanted traffic cameras that have an IP address to show a link, and for those that do not, nothing. This was my work around.

1)Create two Arcade Expressions, one for the conditional field display, and one for a conditional link display.
Here is the conditional field display {expression/expr0}

IIF(IsEmpty($feature.CameraIP), '', "Traffic Camera")

Here is the conditional link display named {expression/expr1}

IIF(IsEmpty($feature.CameraIP), '*No Camera Installed*', "Live View")

2) I modified my Customer Attribute display where my field expression is on the left and my link expression is on the right, highlight the link expression and click on the link icon (chain link) :

3) The link window opens and I put my link expression in the "Text" parameter and my camera IP field in the "URL" parameter.

Results:

Traffic Signal with a Camera:

Traffic Signal WITHOUT a Camera IP:

I hope this helps! Shout out to Bernard Szukalski for giving me some direction to go on this solution.

SarahEllis2

Jared Pilbeam‌ I am still having this issue. I check the bug status and it says it was updated Sep 2019. However, when I try to create a conditional hyperlink, the link text always shows, even when there is no URL. Any solutions for this?

RobertScheitlin__GISP

Jared,

Great. Don't forget to mark this question as answered.

JaredPilbeam1

Was able to remove the unwanted text. I erased URL in the Display window. Just the rest of it to figure out now.

JaredPilbeam1

Robert,

Thanks for the reply.

Sorry, I don't know any HTML. I put your line in and at first it seems like everything was good. I checked some pop-ups that would have a website in the attributes and the link brought me to the right website. But, now the link is showing up on pop-ups of the same attribute table that do not have any websites. So, when you click on the link it brings you back to the web map on a new tab. Also, there's still the text for the link in the pop-up that's not active--not sure how to remove it (see screen shot below).

Here's the whole code:

<SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>table</SPAN> <SPAN class="attr-name token">cellpadding</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>0px<SPAN class="punctuation token">"</SPAN></SPAN> <SPAN class="attr-name token">cellspacing</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>3px<SPAN class="punctuation token">"</SPAN></SPAN><SPAN class="punctuation token">></SPAN></SPAN>
&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>tbody</SPAN><SPAN class="punctuation token">></SPAN></SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>tr</SPAN> <SPAN class="attr-name token">valign</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>top<SPAN class="punctuation token">"</SPAN></SPAN><SPAN class="punctuation token">></SPAN></SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>td</SPAN><SPAN class="punctuation token">></SPAN></SPAN><SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>b</SPAN><SPAN class="punctuation token">></SPAN></SPAN>Name:<SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"></</SPAN>b</SPAN><SPAN class="punctuation token">></SPAN></SPAN><SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"></</SPAN>td</SPAN><SPAN class="punctuation token">></SPAN></SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>td</SPAN><SPAN class="punctuation token">></SPAN></SPAN><SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>span</SPAN><SPAN class="punctuation token">></SPAN></SPAN>{NAME}<SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"></</SPAN>span</SPAN><SPAN class="punctuation token">></SPAN></SPAN> 
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"></</SPAN>td</SPAN><SPAN class="punctuation token">></SPAN></SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"></</SPAN>tr</SPAN><SPAN class="punctuation token">></SPAN></SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>tr</SPAN> <SPAN class="attr-name token">valign</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>top<SPAN class="punctuation token">"</SPAN></SPAN><SPAN class="punctuation token">></SPAN></SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>td</SPAN><SPAN class="punctuation token">></SPAN></SPAN><SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>b</SPAN><SPAN class="punctuation token">></SPAN></SPAN>Address:<SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"></</SPAN>b</SPAN><SPAN class="punctuation token">></SPAN></SPAN><SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"></</SPAN>td</SPAN><SPAN class="punctuation token">></SPAN></SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>td</SPAN><SPAN class="punctuation token">></SPAN></SPAN>{FAC_ADDY_1}<SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"></</SPAN>td</SPAN><SPAN class="punctuation token">></SPAN></SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"></</SPAN>tr</SPAN><SPAN class="punctuation token">></SPAN></SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>tr</SPAN> <SPAN class="attr-name token">valign</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>top<SPAN class="punctuation token">"</SPAN></SPAN><SPAN class="punctuation token">></SPAN></SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>td</SPAN><SPAN class="punctuation token">></SPAN></SPAN><SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>br</SPAN> <SPAN class="punctuation token">/></SPAN></SPAN><SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"></</SPAN>td</SPAN><SPAN class="punctuation token">></SPAN></SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>td</SPAN><SPAN class="punctuation token">></SPAN></SPAN>{CITY_ST_ZIP}<SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"></</SPAN>td</SPAN><SPAN class="punctuation token">></SPAN></SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"></</SPAN>tr</SPAN><SPAN class="punctuation token">></SPAN></SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>tr</SPAN> <SPAN class="attr-name token">valign</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>top<SPAN class="punctuation token">"</SPAN></SPAN><SPAN class="punctuation token">></SPAN></SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>td</SPAN><SPAN class="punctuation token">></SPAN></SPAN><SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>b</SPAN><SPAN class="punctuation token">></SPAN></SPAN>{/expr0}<SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>a</SPAN> <SPAN class="attr-name token">href</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>{URL}<SPAN class="punctuation token">"</SPAN></SPAN> <SPAN class="attr-name token">target</SPAN><SPAN class="attr-value token"><SPAN class="punctuation token">=</SPAN><SPAN class="punctuation token">"</SPAN>_blank<SPAN class="punctuation token">"</SPAN></SPAN><SPAN class="punctuation token">></SPAN></SPAN>Website<SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"></</SPAN>a</SPAN><SPAN class="punctuation token">></SPAN></SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"></</SPAN>b</SPAN><SPAN class="punctuation token">></SPAN></SPAN><SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"></</SPAN>td</SPAN><SPAN class="punctuation token">></SPAN></SPAN><SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"><</SPAN>td</SPAN><SPAN class="punctuation token">></SPAN></SPAN>{URL}<SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"></</SPAN>td</SPAN><SPAN class="punctuation token">></SPAN></SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"></</SPAN>tr</SPAN><SPAN class="punctuation token">></SPAN></SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"></</SPAN>tbody</SPAN><SPAN class="punctuation token">></SPAN></SPAN>
<SPAN class="token tag"><SPAN class="token tag"><SPAN class="punctuation token"></</SPAN>table</SPAN><SPAN class="punctuation token">></SPAN></SPAN><SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

RobertScheitlin__GISP

Jared,

It should be as simple as adding a HTML Anchor element to your last line in the Custom Attribute Display dialog.

<SPAN class="punctuation token">{</SPAN>expression<SPAN class="operator token">/</SPAN>expr0<SPAN class="punctuation token">}</SPAN> <SPAN class="operator token"><</SPAN>a href<SPAN class="operator token">=</SPAN><SPAN class="string token">'{URL}'</SPAN> target<SPAN class="operator token">=</SPAN><SPAN class="string token">'_blank'</SPAN><SPAN class="operator token">></SPAN>your link text<SPAN class="operator token"><</SPAN><SPAN class="operator token">/</SPAN>a<SPAN class="operator token">></SPAN>‍<SPAN class="line-numbers-rows"><SPAN>‍</SPAN></SPAN>

Únete a la Conversación

Los miembros registrados pueden publicar, seguir actualizaciones y más. ¿Nuevo aquí? Regístrate gratis.

Enlaces Rápidos

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.