A field with html merged

I have a field merge {{Temp_User__r.Signature_1__c}}. The field has html formatted code:
Bill Fox
President and Managing Broker
Dorothy.com
bill.fox@dorothy.com
727-400-XX01

Cancel my profit sharing and remove from monthly updates

I have the text box marked as “Allow HTML”

But it sees it as text and ignores the HTML.

1 Like

Note: I’m using V1 and an older version of SKUID

that said…

I’ve found the “Allow HTML” checkbox to make no difference to anything on the running page itself, it seems to only affect the display inside the editor; checked or unchecked the HTML works on the page.

That said, merge fields are automatically coded to be HTML safe by SKUID when embedded somewhere. I don’t know of any direct way around this. This converts HTML characters to their coded counterparts for displaying them in the web browser as normal characters rather than having them interpreted as HTML code.

You could perhaps use javascript to update the contents of the text box directly (using its unique ID and something like the innerHTML function) and set its contents to be the value of your field directly. Not a great solution as it relies on the static ID of the text box to work, but it theoretically should work in a static display sort of scenario. Unless there’s some way with merge fields to decode the HTML as part of embedding the merge field ( a merge field usable equivalent of the javascript function decodeHTML: skuid.utils — Skuid v15.1.6 Documentation ) I don’t think there’s another way to do this.

Not sure I understand?

Basically you’d need to “hack” the HTML on the page directly using a javascript snippet. You’d need to find the ID of the element you want to insert the variable into, and insert it via something like the javascript “.innerHTML” function.

Reference:

const list = document.getElementById("list");

list.innerHTML += '<li><a href="#">Item '+ (list.children.length + 1) +'</a></li>';

The ID would be the ID of the element (as listed in the SKUID editor UI) – though this may just be an outer element and you’d need to actually access an element underneath that. You’d need to investigate the HTML on the page directly to determine what you’d need to code (eg. via Google Chrome inspect)

If access to a child element is necessary I believe you can use this type of code:

I can’t tell you for certain what is necessary here as I run an older version of SKUID and exclusively use V1, but the technique should be sound (albeit very complex for trying to do something seemingly simple)