Render HTML in Pivot Table

Follow

Artem Yevtushenko

February 08, 2019 22:16

widget.on('ready', function(){
     var tags = $('tbody span:contains("<")');
     for(var i = 0; i<tags.length; i++){
         $(tags[i]).replaceWith(String(tags[i].textContent))
     }
});

Before

After

Challenge

Sisense Pivot Tables do not render HTML if it is coming in as a string from an elasticube or live data source.

Solution

Paste the script above into your Pivot Table's "Edit Script" environment.

3

• Official comment

  

  Katie Garrison July 03, 2019 19:55 (Edited July 09, 2019 11:53)

  Adding some steps to make a URL clickable within a pivot table:

  1. Create a custom column within the table with the URLs you would like to make clickable. In this example I called it HTMLURL
  

  Craft the HTML version of the link using <a href> tags. I used column "Link" as the URL and column "Name" as the display text

  '<a href="' + [Link] + '" target="_blank">' + [Name] + '</a>'

  

  This will create a column with the URL wrapped with HTML elements.

  

  3. Rebuild the cube to include the custom column

  4. Create a pivot table with the new column
  

  5. Edit the script of the widget, paste in the following script

  widget.on('ready', function(){
       var tags = $('tbody span:contains("<")');
       for(var i = 0; i<tags.length; i++){
           $(tags[i]).replaceWith(String(tags[i].textContent))
       }
  });

  6. Save the script and refresh the widget. The result should be a formatted link

  

  Hope that helps,
  Katie Garrison | Technical Solutions Consultant

  Comment actions Permalink
• 

  Katie Garrison February 10, 2019 18:08

  Awesome, thanks for sharing Artem!

  1

  Comment actions Permalink
• 

  Brian Wilson February 10, 2019 18:15

  Hi Artem,

  Would this work in a basic table widget as well?

  0

  Comment actions Permalink
• 

  Artem Yevtushenko February 10, 2019 18:42

  Hi Brian, the basic table widget should do this automatically!

  The pivot table widget encloses the cell text with span elements, so special characters for HTML are ignored. The basic table widget does not have these, so it will accept any text, including HTML.

  1

  Comment actions Permalink
• 

  Paul Lam August 19, 2019 20:23

  Does this script also render &nbsp; &reg; or &trade;? I applied the provided script and it doesn't seem too.

  0

  Comment actions Permalink
• 

  Artem Yevtushenko August 19, 2019 20:58

  Hi Paul, I haven't tested this on those cases.

  I recommend doing string substitution in the elasticube.

  For example, edit the substring &nbsp to be " " in a custom column.

  0

  Comment actions Permalink
• 

  Shahar David September 13, 2019 16:04

  Hey, 

  Thanks for this info.

  I've been trying to use that script in one of my dashboards but it seem that even when I add it as widget script it runs on the entire dashboard and effects all widgets. 

  Any ideas why?

   

  Thanks!

  0

  Comment actions Permalink
• 

  Ravid Paldi September 16, 2019 09:40

  Hi Shahar, 

   

  Are you using hte exact same code from this post? 

  If so, then my guess is that is related to the JQuery selector as it uses a generic one (  $('tbody span:contains("<")') ) so it will "catch" ANY span element that has a "<" char within a tbody element - the element that initiates the table.  

   

  Cheers,

  Ravid

  0

  Comment actions Permalink
• 

  Shahar David September 23, 2019 21:18

  Hey,

  Thanks for that, the script works well on the web browser. Once I try to export the report to PDF I get the blue marker but it's not clickable anymore. Anyway to solve this?

  Thanks!

  Shahar

  0

  Comment actions Permalink

Please sign in to leave a comment.