December 12, 2016

How to hide an applet conditionally in Siebel Open UI??

While working on Siebel Open UI - UX improvement projects numerous times we need to access data through PM and PR layer without showing data to user.
For such requirements you just wish if it was possible to have applet in view with all the required fields and methods you need, but just shouldn't show up on UI.


Well that is possible, there are two ways to handle this on the client side.


First Solution: Use appropiate javascript event to find the applet div element and then call .hide(); method to hide the applet.

$("div#" + SiebelApp.S_App.GetActiveView().GetAppletMap()["SIS OM Order Entry - Orders List Applet - Tiny"].GetFullId()).hide();

This way you can control when applet will show up or not. This solution might cause screen to flicker if your event is triggered after applet's show UI event.

Second solution : Use this sneaky two line css rule in your custom theme, with these lines you can make any applet invisible in the entire application.

  div[title='Orders List Applet']{display:none;}

Above css rule if added to the theme css, it will make applet disappear from screen. As CSS load on application load, Applet won't flicker like toggle applets or create empty space, and it is still accesible by Javascript.  All the fields and methods will work as expected.
Before and after applying CSS

Please thank Joseph for sharing these tricks.
Which solution will you prefer? Leave your preference in comments below and please plus one on google or like on facebook if you like the content.

No comments :

Post a Comment