Displaying HTML

Hello, I have a form that consist of a SplitPanel. One the left side, there’s a table with a list of items. On the right side, there’s an embedded component. When the user clicks on the table item, the item’s HTML should display in the embedded component.
I’ve tried many different ways but it doesn’t seem to work. The item has a field called ReportResult which contains the HTML data.
Now, to display it, I read the field data, generate a item.html file and set the embedded.setSource(item.html). Unfortunately, it doesn’t work. i also tried generating the file and then URL url = new File(fileLocation).toURI().toURL(); but it doesn’t work either.
In the documentation, ti says that “Define the resource files directory in cuba.web.resourcesRoot application property, and specify the name of the file inside this directory”.
The statement above is not clear but i tried the following. On my file system, I went to app/Modules/web/src and opened web-app.PROPERTIES (not sure if this is the correct file), and added cuba.web.resourcesRoot = Resources.
Am I on the right track? If so, from my code, how do I get this value so I can generate a html file and then display it on the embedded component?
Thanks.

Hello Francis,
First, set type=“BROWSER” to your embedded component.


<embedded id="reportEmbedded" width="100%" height="200px" type="BROWSER"/>

Next, set source to the embedded in a form of InputStream:


String htmlData = "<html><body><h1> TEST HTML </h1></body></html>";
String browserCacheVersion = UUID.randomUUID().toString();
reportEmbedded.setSource("report" + browserCacheVersion + ".htm",
        new ByteArrayInputStream(htmlData.getBytes(StandardCharsets.UTF_8)));

You have to use browserCacheVersion variable to control caching of “report.htm” resource in a web browser.
I do not recommend to use URL because your content is dynamic and depends on the selected item.

Thank you so much Yuriy,
Your solution worked perfectly. I’m happy.

Hello, the solution above works but it seems that when nothing is clicked, (or when the page shows up by default, the embedded component displays the application home page with the menus. Is there a way to set it so that the component is blank when nothing is selected?
thanks.

It is an issue in Embedded component, it should not show application page in empty state. We will fix it in one of the next bugfix releases.
Now, you can simply set empty html content to the embedded:


String emptyHtml = "<html><body></body></html>";
reportEmbedded.setSource("empty.htm",
        new ByteArrayInputStream(emptyHtml.getBytes(StandardCharsets.UTF_8)));

Hi,
the problem is fixed in the platform version 6.0.9.