Skip to main content
Solved

Show HTML in Previewer in Universal GUI


Harm Horstman
Superhero
Forum|alt.badge.img+21

It seems like not possible to show HTML in the previewer component in Universal.

Is this not yet possible in the Universal GUI or can it be realized in another way?

See below an example of a HTML page shown in de Windows GUI versus Universal

 

Universal:

 

Best answer by Erik Brink

Hi Harm,

It is indeed not supported yet to feed the preview component html text to show. This is still open on our backlog for the Universal GUI.

As a workaround you can think of a cardlist or a form with a single (html) column, linked as a detail to this subject using a 1-on-1 self-reference. Or saving the html text to a file and link it to a url control, where the preview component is bound to. 

We understand this is all not ideally.

Best regards,
Erik

View original
Did this topic help you find an answer to your question?
This topic has been closed for comments

18 replies

Freddy
Forum|alt.badge.img+16
  • Thinkwise Local Partner Brasil
  • 528 replies
  • November 23, 2022

Hi @Harm Horstman

I am assuming you have a HTML field here. I think you can achieve it using a cardlist component and set up the card list to only show the HTML field. If I remember correctly it will automatically adjust its height to the contents. 


Harm Horstman
Superhero
Forum|alt.badge.img+21
  • Author
  • Superhero
  • 495 replies
  • November 23, 2022

Hello @Freddy,

 

Thanks, for the tip. That would be great, I will give it a try.

 

 


Harm Horstman
Superhero
Forum|alt.badge.img+21
  • Author
  • Superhero
  • 495 replies
  • November 23, 2022

@Freddy,

I've tried it and it looks promising. However, one problem, long texts are is not wrapped properly.

Do you have experience with this problem? And have you already found a solution for it?

 

 


Freddy
Forum|alt.badge.img+16
  • Thinkwise Local Partner Brasil
  • 528 replies
  • November 23, 2022

@Harm Horstman yes you can do that with custom CSS. 

 

 white-space: normal !important;

@tiago can you confirm it was this CSS part that made word-wrapping a reality? 


Harm Horstman
Superhero
Forum|alt.badge.img+21
  • Author
  • Superhero
  • 495 replies
  • November 23, 2022

@Freddy 

Nice, but can you give me a full example of how your custom.css looks like?


Freddy
Forum|alt.badge.img+16
  • Thinkwise Local Partner Brasil
  • 528 replies
  • November 23, 2022
Harm Horstman wrote:

@Freddy

Nice, but can you give me a full example of how your custom.css looks like?

 

Add the following to your custom CSS, maybe it works straight out of the box :)

.cardlist-item-container .cardlist-item__value, .css-4f29yv .cardlist-item-container .cardlist-item__label, .css-4f29yv .cardlist-item-container .cardlist-item__value > *, .css-4f29yv .cardlist-item-container .cardlist-item__label--checkbox {
    white-space: normal !important;
}

 


Harm Horstman
Superhero
Forum|alt.badge.img+21
  • Author
  • Superhero
  • 495 replies
  • November 23, 2022

Thank you @Freddy, but unfortunately this doesn't seem to be the solution, maybe @ServiceAndCare ( @Jeroen van den Belt ) can give answers?


Erik Brink
Moderator
Forum|alt.badge.img+5
  • Moderator
  • 497 replies
  • Answer
  • November 24, 2022

Hi Harm,

It is indeed not supported yet to feed the preview component html text to show. This is still open on our backlog for the Universal GUI.

As a workaround you can think of a cardlist or a form with a single (html) column, linked as a detail to this subject using a 1-on-1 self-reference. Or saving the html text to a file and link it to a url control, where the preview component is bound to. 

We understand this is all not ideally.

Best regards,
Erik


tiago
Captain
Forum|alt.badge.img+5
  • Captain
  • 46 replies
  • December 5, 2022

@Freddy @Harm Horstman

Sorry for the late response.  

The css provided by Freddy is indeed what prevents the sentences being cut off in the card lists. 

When you test it, make sure to throw away the cache, to make sure the new CSS is loaded. 

 

 


Harm Horstman
Superhero
Forum|alt.badge.img+21
  • Author
  • Superhero
  • 495 replies
  • December 7, 2022

I finally found a good workable solution by adding some inline styling in the dataset

SELECT note_guid
     , note_body_html = '<p style = "margin: 4.00px; white-space: normal;">
                      + <span style="color: #3366ff;">' 
                      + FORMAT(n.insert_date_time, 'dd-MMM-yyyy HH:mm:ss', 'en-en') + ' - ' 
                      + ISNULL(u.friendly_name, n.insert_user) + '<br/><br/>' + note + <p/>' 
     , note_date_time = n.insert_date_time
FROM      note  n
LEFT JOIN users u ON u.user_name = n.insert_user

 

 This is the result:

 

 


Erik Brink
Moderator
Forum|alt.badge.img+5
  • Moderator
  • 497 replies
  • December 8, 2022

It is indeed an option to include it in your data too, but it will increase network load.

Since it is a static piece of CSS styling. You can place it in the resources of the GUI as described here:
https://docs.thinkwisesoftware.com/docs/sf/themes#custom-css-in-the-universal-gui

The advantage of this is that this piece of CSS is only send to the client once, when the GUI is opened for the first time.

 


Harm Horstman
Superhero
Forum|alt.badge.img+21
  • Author
  • Superhero
  • 495 replies
  • January 17, 2023

@Erik Brink when can we expect a previewer component that can handle HTML? Is it necessary to make a ticket for this? Or is development already in progress?


Erik Brink
Moderator
Forum|alt.badge.img+5
  • Moderator
  • 497 replies
  • January 18, 2023

Hi Harm,

I will bring it up for the planning of upcoming sprints. We will react to this post once we know more.

Best regards,
Erik


Harm Horstman
Superhero
Forum|alt.badge.img+21
  • Author
  • Superhero
  • 495 replies
  • January 18, 2023

@Erik Brink: what about showing external webpages (URL) in the previewer? Or is this already possible in the Universal GUI? This to embed for example a PowerBI report.


Erik Brink
Moderator
Forum|alt.badge.img+5
  • Moderator
  • 497 replies
  • January 19, 2023

At the moment, only for web-addresses with the same origin as the GUI/Indicium. Browsers will block the rest due to CORS security.

There is an item on the backlog to research possibilities with this, e.g. allowing a whitelisted set of addresses to show up. We need this to work ourself to on e.g. TCP.


Erik Brink
Moderator
Forum|alt.badge.img+5
  • Moderator
  • 497 replies
  • April 4, 2023

In the upcoming release (2023.1.15) the Universal GUI will add support for previewing the data of an HTML type column in the preview component. 


Harm Horstman
Superhero
Forum|alt.badge.img+21
  • Author
  • Superhero
  • 495 replies
  • April 5, 2023

Hi @Erik Brink, when can we expect the new release?


Erik Brink
Moderator
Forum|alt.badge.img+5
  • Moderator
  • 497 replies
  • April 7, 2023

Sorry @Harm Horstman for my late response. It is available now in TCP as a beta release. Next week on friday as the official release.


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings