Addons

Layout and Widget Display

Updated: December 17, 2024

JSF UI Deprecation
This requires to have the JSF UI addon installed on your server that is deprecated since Nuxeo Platform LTS 2019.
Please refer to the Web UI documentation.

Layouts can be displayed thanks to a series a JSF tags that will query the web layout service to get the layout definition and build it for a given mode.

The more common way to display a given layout for a document is to use the nxl:layout tag:


<div xmlns:nxl="http://nuxeo.org/nxforms/layout">
  <nxl:layout name="heading" mode="view" value="#{currentDocument}" />
</div>

Layouts that are referenced on a document type definition can use other helper tags, see the corresponding documentation.

You can include a layout in a dataTable tag, but cannot make its mode depend on the iteration variable. If you need to do so, recommendation is to use the c:forEach tag and handle all the <table>, <tr>, <td>... tags by yourself.

For instance, here is a sample display of a listing layout. The layout template is configured to display table rows. It will display header rows when the parameter showListingHeader is true.


<table class="dataOutput">
  <c:forEach var="row" items="#{documents.rows}" varStatus="layoutListingStatus">
    <c:set var="showListingHeader" value="#{layoutListingStatus.index == 0}" />
    <nxl:layout name="#{layoutName}" value="#{row}" mode="view"
      selectedColumns="#{selectedResultLayoutColumns}" />
  </c:forEach>
</table>

Some other advanced tags make it possible to display a global widget for instance, or even to create a widget from scratch by specifying its definition using the tag attributes.

Here is a sample usage of the nxl:widget tag:

<nxl:widget name="widgetName" mode="#{myMode}" value="#{myObject}" required="true" />

Here is a sample usage of the nxl:widgetType tag (creating a widget definition on the fly):

<nxl:widgetType name="text" mode="#{myMode}" value="#{myText}" required="true" />

Please refer to the tag library documentation available at http://community.nuxeo.com/api/nuxeo/latest/tlddoc/nxl/tld-summary.html.


Related section in Studio documentation

Form Layouts