The Service UI Frame control allows the user to view services and comes with easy to configure appearance and behavior options. The Service List control lists the services, and the Service UI Frame control displays the selected service.
Note that not all services will have a UI which displays cleanly.
Like all Portal Builder controls, you can trigger events that are fired when the user interacts with the control (see the Event and Methods sections below and the Event Handling article for more information).
Appearance
Style of Content The specified style of the frame. The name of the CSS file, the type, and the app acronym
Css file Name of the CSS file
Css Type Web, External, Server, Design
App acronym The Process App acronym, e.g. 
Width The width of the frame, e.g 50px, 100%, default unit is in px if not specified
Height The height of the frame, e.g 50px, 100%, default unit is in px if not specified
Behavior
Navigate On Task Closed Will have the control fire a boundary event when the frame is closed
Example
Here are the Task List configuration option settings...
Note: The Control Id of the Service UI Frame is Service_UI_Frame1
The Service UI Frame configuration option settings...
The Custom HTML (this changes the sub-type to an icon, see Font Awesome for a list of icons)....
When the page first loads...
When a service is selected, that service is displayed...
Events
With the Service UI Frame control, there are 5 types of event handlers:
- On Load When the page loads, Note that this particular event is only fired ONCE per page load
- On Service Open When a service is opened
- On Service Closed When a service is closed
- On Service Unavailable When a service is not available
- On Status Changed When the status of a service has changed
You can use JavaScript logic to affect the effects of the control, depending on the event. More information on using these controls can be found in the Event Handling article.
Methods
For detailed information on the available methods for this control, access the JS Doc file.
- Author: Courtney Silva
- Date Created: February 25, 2016
- Date Modified: March 1, 2016
Comments