18.3. User interface customization

The following three examples describe common use cases for customizing the User Portlet.
  • Example 1: Describes how to tag a input field as required and add it to the registration page.
  • Example 2: Shows how to create a simple dropdown menu.
  • Example 3: Describes how to add new properties.

Note

This is not a JavaServer Faces tutorial. Basic knowledge of this technology is a precondition for customizing the User Portlet Interface.

18.3.1. Example 1: required fields

This example explains how to change optional properties to required properties, of course once this is done, we will also need to add the corresponding fields in the registration page. Here are the modifications in portal-identity.sar/conf/identity-ui-configuration.xml, we simply changed the required element to true on our two fields corresponding to the given and family names.
<identity-ui-configuration>
...
    <!-- user interface components -->
        ...
        <ui-component name="givenname">
            <property-ref>user.name.given</property-ref>
            <required>true</required>
        </ui-component>
        <ui-component name="familyname">
            <property-ref>user.name.family</property-ref>
            <required>true</required>
        </ui-component>
        ...
</identity-ui-configuration>
Now that we changed those values to "required" we need to give a chance to the user to enter those values, here are the changes done in portal-identity.sar/portal-identity.war/WEB-INF/jsf/common/register.xhtml
...
    <h:outputText value="#{bundle.IDENTITY_GIVENNAME}"/>
    <h:inputText id="givenname" value="#{manager.uiUser.attribute.givenname}"
            required="#{metadataservice.givenname.required}"/>
    <h:panelGroup />
    <h:message for="givenname" />

    <h:outputText value="#{bundle.IDENTITY_FAMILYNAME}"/>
    <h:inputText id="lastname"  value="#{manager.uiUser.attribute.familyname}"
            required="#{metadataservice.familyname.required}"/>
    <h:panelGroup />
    <h:message for="lastname"/>
...
That's it - from now on the given name and family name will be required on registration. We dynamically obtain the values from the descriptor. Now if i just wanted to make them back to optional, i would change the values only in the descriptor, letting the user enter or not those values.