Displaying HTML with Jelly in a UI page

jdurden
Kilo Explorer

So, I went into this project thinking this was going to be pretty straight forward. And, maybe it is. But what I thought should work intuitively isn't working as I anticipated and the information I'm finding online isn't working.

What I'm trying to do is display some HTML (on a UI Page) which is stored in a variable. Example...



<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
<g:evaluate>
var test = "<b>this is bold</b>";
</g:evaluate>

${test}
</j:jelly>


In case it's not clear, the desired outcome is to have a simple bold text "this is bold" display on the UI Page when visited. However, when you visit the page it looks like:

<b>this is bold</b>


Clearly the HTML is being encoded at some point in this whole thing and, despite searching forums and Google, I'm unsure how to fix it. Any ideas?


Thanks in advance!

25 REPLIES 25

Yes, I was trying to query for the HTML value in a catalog UI policy script, then send it into the GlideDialogWindow using setPreference. Even though the value comes through, it will not render as HTML. Yet if using GlideRecord query within evaluate in UI Page, the value does render as HTML.


Yea, sending html-field is kind of tricky. Don't even try to pass them with an URL 😃 I used Session client data for that.


I have the HTML displaying the way I want it on my UI Page, but when I try and use a GlideDialogWindow, it shows the HTML tags.



Here is what I get when using a GlideDialogWindow tag in a UI Action


<p>02-24-2016 02:08:10 PM - Mark Didrikson (Work notes) More Work Notes</p><p>02-24-2016 11:35:29 AM - Mark Didrikson (Work notes) testing 123</p><p></p>



Here is what I get on the UI Page:


Work Notes:

02-24-2016 02:08:10 PM - Mark Didrikson (Work notes) More Work Notes


02-24-2016 11:35:29 AM - Mark Didrikson (Work notes) testing 123



Any ideas why the content does not render using the GlideDialogWindow tag?



Thanks!



Mark Didrikson


I found a workaround.   If you use the GlideBox class in your UI Action, it will render correctly.


function renderWin() { var gb = new GlideBox({ iframe : "kb_dialog.do?number=KB0000011&continue=Continue&cancel=I'm All Set", width : 600, height : "95%", title : "KB Article", noTitle : true }); gb.render(); }


In a Geneva Instance,



<g2:evaluate var="jvar_nat_ann" object="true">


var sidNatAnnouncement = "${RP.getWindowProperties().get('sidAnnouncement')}";


var grNatAnn = new GlideRecord('u_native_announcement');


grNatAnn.get(sidNatAnnouncement);


</g2:evaluate>



and then



<g:no_escape>$[HTML:grNatAnn.u_announcement_message]</g:no_escape>



Produces in the Actual Glide Dialog Window



<h1>Incident Tasks</h1> <p><em>Are you assigned to an Incident?</em><br /> <em>Do you need another group to help resolve that Incident?</em><br /> <em>Do you want to maintain ownership of the Incident?</em></p> <h2>Introducing Incident Tasks!</h2> <p>Create Incident Tasks to assign support work for Incident resolution to other groups without having to reassign the Incident.</p> <ul><li>Incident Tasks inherit the Priority from the parent Incident.</li><li>Incident Tasks inherit the Due Date and SLA from the parent Incident.</li><li>Incident Tasks can be assigned to any valid Assignment Group.</li><li>Incident Assignee will be notified when an Incident Task is completed.</li></ul>



So, I am still not finding a solution.