What is a UI Rule?

UI Rule allows you to add dynamic behaviour to the Page. Using UI rules you can change the Page Title, Hide Fields, Show Fields etc. UI Rules are defined at page level and the same can be applied to the referenced pages.

When do we use it?

Rules can be used when you need to manipulate the UI items on the fly based on actions being performed on the Page by user.
You can perform an Action on the page when a specific event is performed on a respective component like,
On Change of Value in a Text field or a Combo box - Perform some action.
On Click of a Button or a Link - Perform an action like hide certain fields.
When a new Record is created in a container - Perform an action to highlight it.
On Focus of a UI Item like TextField, DateField, Combobox etc perform an action.
On Page Active,  hide a tab based on the role specified etc..

To know more about the Ui rules Expressions,refer Ui Expressions


For Example if you want to show UI controls like Button, Text Field etc to users with specific Role you can do by setting up a UI Rule on the respective page.

Since the UI Items should be shown in the UI only when a user with specific Role, you can set the Visible property of the UI controls to false so that it does not appear to other Roles.

Let us consider that when a user logs in as Admin and clicks on Order List tab, then he should be able to see the Search Criteria on Top and a grid below it.

Now when a person logs in as a user, the top search panel should be hidden and only grid should be displayed.

To do this, you need to make use of a Ui rule. 

Here is how the UI rule is configured.

Click on the Define Ui rules. 
Enter the role code, page , enable active check box,give description if needed.

Trigger & Action tab :

Event: It is when you want to perform the action.( Before Page Init, On Click, Record Active, Page Active etc..)

On Object: It defines when the action has to take place, that is on which “item id”.

Example :

 Event: On click

On Object : ‘item28’(button)

Condition: Specify the condition when the Ui rule has to fire.

Example: #{session.rolecode}=’User’

Action When True:

Here you need to specify the expression that has to execute when the condition is true.

Action When False:

Here you need to specify the expression  that has to execute when the condition is false.


In the scope tab you need to specify the scope level. Here scope level is nothing but to a specific role or to particular user. Enable the active checkbox.


Now go to preview page and go to the page for which you have written the ui rule. Right Click and click on Reload Page Rules.

Now when you login as a user with specific role to which that Ui rule would apply, you can see that the Grid is hidden. 

This is how the Ui rule can be applied.

setVisible('item904',false) - Make use of built in Function setVisible which will take item(s) and set the Visible property of those Items to true

   Ability to navigate to the rule management screen from customize page for a specific item id:

Once you are in customize page and if you want to write an Ui rule on particular ‘item id’. Go to  the item id of the widget and when you focus on the item id ,an icon will be displayed. Now click on the icon and this will straight away navigate to the Ui Rules page.



Related Topics: Server Side Validation, Validate Row, Reset Form Panel, Condition, Expression, Object Handler


101 California Street, Suite 2710
San Francisco, CA 94111

440 N. Wolfe Rd.
Sunnyvale, CA 94085

Office 11, 5th Floor, Building 9,
Mindspace IT Park
Hyderabad 500081

p: +1 (844) AT CloudIO (844-282-5683)
f: +1 (650) 300-5247 | e: sales@cloudio.io
© 2009, 2017 CloudIO Inc. | Terms of Use | Privacy Policy