Folder Browser Widget not work as expected in custom html page in CS 21.x

dluo · 2021-11-18T20:49:10+00:00

There was an error rendering this rich post.

I am trying to embed a folder browser widget into a custom html page by import related css and js files and then load the widget on a div element.

It works well in CS 16.2.11. It displays the exact content with correct style. However, the same code does not work as expected in CS 21.3. I managed to make it load after changing to load different set of js files (csui js libraries being different now). But the widget style looks not correct.

What is the current standard steps to include a CS widget into a html page to make it behave the same as native one?

Find more posts tagged with

Comments

Appu Nair

I am slightly confused, I developed everything as you said on a 16.2 system and the same page (no changes in OT Widget code) worked... The first few lines of that Javascript is reaching out to ContentServer to get the javascript objects & CSS does your browser show any deny's in the call or using Fiddler.Is it a difference then between 21.2 or 21.3 because what I am showing is on 21.2

...BTW I started with here at the XECM offering https://webapp.opentext.com/piroot/eep/v200300/eep-cgi/en/html/jsframe.htm?integrate-widgets-folder

dluo

I guess I may not follow the correct way to use the widget.

In CS16, I am using below code. There is no csui-loader.js in CS21.3, I have to import "/img/csui/nucleus/bundles/nuc-loader.js" instead. I cannot find a way to address the style issue.

Appu Nair

Is stelesheet a typo or allowed in another language ? Also you are using relative which means that the page should be part of content server , my implementation is in another application ( Maximo) so I would try resolving those . Is there a reason you cannot use the code in the link I posted ?

dluo

Test Widget.html.txt

Yes, I had a typo in previous post. I tested the code in the link you posed (the test file is attached). It works well in CS16. But in CS21.3, it run into an error and will not load the widget.

Appu Nair

OK good then maybe I will also have to do something in 21.3 .@Ferdinand Prantl or @Reiner Merz care to comment. I have seen some stuff from OT saying something about nucleus. What if you put that text content above in a WR and see if it runs that si what I usually do put the code in a WR so it has all the libraries etc...

Ferdinand Prantl

@dluo, you need to replace the two script elements from your screenshot with the following one:

<script src="/otcs/cs.exe/widgets"></script>

Read the chapter "Getting Started" in the SDK, please. It shows how the source code of a page with embedded widgets looks like.

dluo

@Ferdinand Prantl , the source code in SDK is similar to the code in the link Appu posted. I get the same error message in CS 21.3. If you check the code I attached in last reply, I am already using the script element you mentioned.

Ferdinand Prantl

@dluo, the exception means that Marionette could not locate the region's element to insert the view's element into. The message is confusing, because it says "undefined" instead of "#content", but otherwise it is correct.

The reason is that the HTML markup on your page is invalid and when the browser loads it, there is no #content element there. Once you fix the errors on your page, the element will be rendered and the widget will work.

1. Add the ending double quote to the href attribute value at line 8:

2. Remove the opening tag "script", which has no closing tag at line 49:

~~<script>~~

dluo

@Ferdinand Prantl You are right, I made some mistakes when test the code with widgets script element. Sorry for the confusion. Now it works as expected.

Thank you both for your time.