Web UI Framework

How to Control the Display Mode of a Widget

Updated: October 16, 2020

It is a very frequent requirement to be able to control the display mode of a widget depending on some conditions such as the life cycle state of the document, or the groups a user belongs to. Nuxeo Studio enables you to leverage the power of the Nuxeo Layout service and to implement your requirements using an expression when you configure your widget.

For instance, when you are editing a document layout, whether it is the creation, edition or view layout, if you edit the widgets you dropped on the layout, you will see the "Advanced mode configuration" section.

  1. Unfold the option by clicking on the black arrow,
  2. Fill the text area with an expression that will control the display of your widget. Here are some samples:
  • #{layoutValue.currentLifeCycleState =='approved' && currentUser.model.user.company == 'Nuxeo'?'edit':'hidden'} This expression says that the field will be invisible unless the document is in state "approved" and the company of the user is "Nuxeo". In that case it will be editable.
  • #{currentUser.isMemberOf('quality_managers') && (layoutValue.dc.nature=='procedure'||layoutValue.dc.nature=='decree')?'edit':'view'} This expression says that the field will be editable only for people from group quality_managers and only if the document is a decree or a procedure. Otherwise, value is just viewable.
  • #{nxd:hasPermission(layoutValue, 'Editorial')?'edit':'view'} This expression says that the widget will be editable only for users having the Editorial permission.

You can also see the reference documentation on layouts, more specifically the EL expressions in layouts and widgets section.