cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Cris2
Helper I
Helper I

Insert a hyperlink in form section label

Hi

 

I would like to override a form's section label with text containing hyperlinks.

I'm not sure if this would be achieved through content snippets, javascript, metadata or combination.

What are the steps to do so?

Thanks in advance.

Cris

2 ACCEPTED SOLUTIONS

Accepted Solutions

Hi @Cris2,

The section title is presented on the page as a legend HTML tag. Unfortunately, the tag on the page doesn't have any sort of id attribute so we will need to trick it around. For this, we can use data-name attribute of the underlying table (which is a name of the section from dataverse form) 

OOlashyn_0-1631218293615.png

We can get the table by data-name attribute, then it's parent and from there get a legend from the direct children list of that element. After that you can insert whatever link you need via html function:

$( document ).ready(function() {
    $("table[data-name='tabGeneral']").parent().children("legend").html("<a href='#'>Test</a>");
});

You need to insert this code to the Custom Javascript field of Additional settings of your form.

----------------------------------------------------
If you find this post helpful consider marking it as a solution to help others find it.

View solution in original post

Hi 

 

I had replaced some " with ' and it worked. Thanks for your help with detailed explanation. Much appreciated!

 

Thanks 

Cris

 

 

View solution in original post

7 REPLIES 7
RalphyC
Helper I
Helper I

Hi  this should be fairly straight forward. Depending on the form, you'll be able to find the webtemplate or snippet that sets the section and then create your own. This can be dynamic and data led too. As an example from one of my pages:

<h2><a title="Link to Report Name" href={{ reports_marker.url }}?id={{item.publishingreference.id}}>{{item.organisationid.name}} (Ref: {{item.publishingreference.name}})</a></h2>

where the base URL is set as a sitemarker (reports_marker), the GUID is brought in dynamically from the item record, and the label too is built from different fields in the item record. Wrap the whole lot in <a/> and away you go. 

 

Let me know if this helps

 

Ralph

@Cris2

Thanks Ralph, Currently we have a single template for all web pages. The section label contains both text and a hyperlink embedded. 

I created a html content snippet with the text and anchor (<a></a>) for the hyperlink. How do I use this in the portal mgmt app? Should I add a javascript in Advance form step -> form options tab -> custom javascript? 

Please provide me with a sample javascript.

Thanks

Hi @Cris2 

From what you've described (and I may be missing something) there's no need to use JS for this. You can add the snippet as a liquid reference (see below) straight into your template/html.

{% include SNIPPETNAME %}

 

Hi Ralph

I inserted the below line with the snippet name in the web page template via cod editor, saved and sync configuration, but no luck. It is not showing up on the web page. Kindly advice where I have gone wrong.

{% include SNIPPETNAME %}

 Thanks

Hi @Cris2,

The section title is presented on the page as a legend HTML tag. Unfortunately, the tag on the page doesn't have any sort of id attribute so we will need to trick it around. For this, we can use data-name attribute of the underlying table (which is a name of the section from dataverse form) 

OOlashyn_0-1631218293615.png

We can get the table by data-name attribute, then it's parent and from there get a legend from the direct children list of that element. After that you can insert whatever link you need via html function:

$( document ).ready(function() {
    $("table[data-name='tabGeneral']").parent().children("legend").html("<a href='#'>Test</a>");
});

You need to insert this code to the Custom Javascript field of Additional settings of your form.

----------------------------------------------------
If you find this post helpful consider marking it as a solution to help others find it.

View solution in original post

Hi

I found out the data-name and inserted the below script in Advanced Form Step -> Form Options -> Customer Javascript&colon;

 

 

$(document).ready(function() {
$("table[data-name='tab_8_section_1']").parent().children("legend").html("<a href='#'>Test</a>");
});

 

 

On save gave me a script error:  

One of the scripts for this record has caused an error. For more details, download the log file.

Cannot read properties of null (reading 'Xrm')

Session Id: d8d3cf0c-dd03-446d-8a72-c1b4c4d31a7c

Correlation Id: 3e376a06-e27f-498e-b845-123f0c0ed34b

Event Name: onsave

 

Also, instead of '.html("<a href='#'>Test</a>")', I would want to use content snippet.

 

Thanks

 

Hi 

 

I had replaced some " with ' and it worked. Thanks for your help with detailed explanation. Much appreciated!

 

Thanks 

Cris

 

 

View solution in original post

Helpful resources

Announcements
UG GA Amplification 768x460.png

Launching new user group features

Learn how to create your own user groups today!

Community Connections 768x460.jpg

Community & How To Videos

Check out the new Power Platform Community Connections gallery!

Welcome Super Users.jpg

Super User Season 2

Congratulations, the new Super User Season 2 for 2021 has started!

Carousel 2021 Release Wave 2 Plan 768x460.jpg

2021 Release Wave 2 Plan

Power Platform release plan for the 2021 release wave 2 describes all new features releasing from October 2021 through March 2022.

Users online (2,413)