Entity List/ View - add link text to url field

[MRown]

Hi,

Thank you for everyone participating in the board - I find these resources hugely helpful and grateful to everyones contributions.

I have a question regarding a page rendered view of a read only entity list.

The entity list has URL (data type) fields, and since some of the links are very long (100+characters) it makes the entity stretch.

I was wondering if there was a way to create a hyperlink to shorten the long link.

The links are to pdf documents which are unique and added manually to the column.

here is an example of a list view

so for practicality it would be ideal if any link in the (invoice link) entity would be displayed (rendered) as a hyperlink Invoice Link  and any link in the (PDF link) entity would be shown as PDF Link.

I appreciate your help!

Kind regards,

MRown

[MRown]

 I've experimented with adding Custom Java:

Add a webpage to render a list of records on a portal - Power Apps | Microsoft Docs 

• Changed the entity form field - data type to (text). added URL using the form.

then attempted to wrap the URL so to append >Link PDF<a/>

$(this).wrap("<a href='"'">PDF Link</a>);

• A different approach was to change $("a").text("PDF Link") of course this renamed all links on the rendered page to (PDF Link)😂

Looking forward to seeing some new ideas/ thoughts!

All the best,

MRown

[Gwham]

If you are not using any of the out the box features such as paging and filters (although this can also be achieved) I would suggest making a new web template for your entity list and controlling the rendering yourself. You can then amend how you would like this to appear.

See example below:

{% entitylist id:page.adx_entitylist.id %}
	{% assign filters = entitylist | metafilters: params.mf, entityview %}
	{% entityview id:params.view, search:params.search, order:params.order, page:params.page, pagesize:params.pagesize, metafilter:params.mf %}
		{% if entityview.records.size == 0 %}
			<div class="alert alert-warning">No xxx available.</div>
		{% else %}
			<table>
				{% for e in entityview.records %}
                    <tr>
                        <td>{{e['fullname']}}</td>
                        <td><a href="{{e['URL']}}">Click Me</a></td>
                    </tr>
				{% endfor %}
			</table>
		{% endif %}                    
	{% endentityview %}
{% endentitylist %}

[C2GUY]

I would suggest creating a new web template and rendering your entity list using your own mark-up.

This way you have complete control over it and can render your hyperlinks as you require.

See example of this below:

{% entitylist id:page.adx_entitylist.id %}
	{% assign filters = entitylist | metafilters: params.mf, entityview %}
	{% entityview id:params.view, search:params.search, order:params.order, page:params.page, pagesize:params.pagesize, metafilter:params.mf %}
		{% if entityview.records.size == 0 %}
			<div class="alert alert-warning">No xxx available.</div>
		{% else %}
			<table>
				{% for e in entityview.records %}
                    <tr>
                        <td>{{e['fullname']}}</td>
                        <td><a href="{{e['URL']}}">Click Me</a></td>
                    </tr>
				{% endfor %}
			</table>
		{% endif %}                    
	{% endentityview %}
{% endentitylist %}

[justinburch · Accepted solution]

Hi @MRown,

One small note - Java isn't the same as JavaScript. 🤐

While you could add the entitylist to the template manually as @C2GUY has recommended, the formatting is going to be inconsistent unless you plan to do this for every entity list in your Portal.

Your first approach was best. Try the following, replacing FIELD-SCHEMA with the schema/logical name of the URL field.

$(document).ready(function () {
  $(".entitylist.entity-grid").on("loaded", function () {
    $(this).children(".view-grid").find("td[data-attribute='FIELD-SCHEMA']").each(function (){
      $(this).html("<a href='"+this.innerText+"'>PDF Link</a>");
    });
  });
});

[MRown]

@justinburch 

Thank you so much for clarifying the script to make it possible to work.

this worked first go - and I hope it'll also help others trying to hyperlink entity list field links.

Much appreciated!

All the best,

MRown

[MRown]

@C2GUY 

Thank you so much for your suggestion - im sure this'll come in handy at some point!

The Javascript ( Thanks @justinburch) worked for this purpose great!

all the best,

MRown