I am trying to adjust the custom attribute display (HTML) in my web map popups to account for the database of attributes.
Here is what I mean. I have a custom popup that I made for a web map/app and it looks nice and clean when the attributes are 'behaving':
But, when I have a really long attribute, like a URL, it makes my popup a lot messier:
Question:
Is there a way to use an if/then statement, or so, in the custom HTML in order for it to see if the attribute is a URL or if it is super long that it won't display it all or convert the html to a clickable link?
Here is the snippet of HTML I used in my custom attribute display:
<table style="border:2px solid; border-collapse:collapse; width:100%">
<tbody>
<tr style="background-color:#DCDCDC; border:1px solid">
<th style="border:1px solid; padding:5px"><b>Name</b></th>
<td style="padding:5px">{SourceFile}</td>
</tr>
<tr>
<th style="border:1px solid; padding:5px"><b>Project #</b></th>
<td style="padding:5px">{ProjectNumber}</td>
</tr>
<tr style="background-color:#DCDCDC; border:1px solid">
<th style="border:1px solid; padding:5px"><b>Date</b></th>
<td style="padding:5px">{CreateDate}</td>
</tr>
<tr>
<th style="border:1px solid; padding:5px"><b>Description</b></th>
<td style="padding:5px">{Description}</td>
</tr>
<tr style="background-color:#DCDCDC; border:1px solid">
<th style="border:1px solid; padding:5px"><b>User</b></th>
<td style="padding:5px">{User_}</td>
</tr>
<tr>
<th style="border:1px solid; padding:5px"><b>Discipline</b></th>
<td style="padding:5px">{Discipline}</td>
</tr>
<tr style="background-color:#DCDCDC; border:1px solid">
<th style="border:1px solid; padding:5px"><b>Visit Type</b></th>
<td style="padding:5px">{VisitType} <br /></td>
</tr>
<tr>
<th style="border:1px solid; padding:5px"><b>Route</b></th>
<td style="padding:5px">{Route} <br /></td>
</tr>
</tbody></table>
(it sure is complicated when you cannot use Style or CSS elements properly...)