Customizing UI form fields
You can customize the form field for a given attribute.
About this task
Although you can customize the presentation completely, Delegated Admin provides example files to demonstrate the functionality and capabilities.
Because the example files most likely require modifications to address your specific needs, you should have a basic level of familiarity with HTML, CSS, and JavaScript when dealing with custom UI form fields. |
The example files cover the following scenarios:
-
Single-selection lists, which allow users to select one item from multiple options
-
Check boxes, which can be customized so that one check box is dependent on the other
-
String fields with validation and error messages
-
Custom, user-friendly display of a JSON attribute, such as
ubidEmailJSON
-
Multivalue string field, which allows users to enter multiple, comma-separated values
To set up Delegated Admin to use the custom HTML files and to display custom UI form fields:
Steps
-
Go to
PingDirectory/webapps/delegator/app/customAttributes
. -
Use a text editor to open the relevant example HTML file, as shown in the following table.
UI Form Field Example File Single selection list
example-select.html
Dependent check boxes
example-dependent.html
String field
example-basic.html
Custom display of a JSON attribute
example-json.html
Multivalue string field
example-multivalue.html
-
Make the appropriate modifications to the example file.
For information about resizing and other custom capabilities, see the comments in
PingDirectory/webapps/delegator/app/assets/iframe—v1.js
. -
Save the example file as a new file named
attributeName.html
.Example:
For example, if you are setting up a custom attribute presentation for
cn
, name the filecn.html
. -
Optional: For further clarity, create a directory under the
customAttributes
directory with the name of the resource endpoint of the REST resource types.Example:
For example, because a
users
type exists with the endpointusersEndpoint
, you might placecn.html
in acustomAttributes/usersEndpoint/
directory.When locating the appropriate HTML file, Delegated Admin searches for the attribute name under the endpoint folder if one exists, and then searches under the
customAttributes
folder. -
In the PingDirectory server, set the
attribute-presentation
field for theDelegated Admin
attribute tocustom
.Example:
dsconfig set-delegated-admin-attribute-prop \ --type-name users \ --attribute-type cn \ --set attribute-presentation:custom
Next steps
Browsers that attempt to aggressively cache HTML files often save and reuse outdated versions of those files. Because such browsers might not display changes that are made to an example HTML file, include the following <meta>
tag in the head of each custom HTML file.
<meta http-equiv="Cache-Control" content="no-cache"/>
If your browser still doesn’t display the updated HTML file, try the following:
-
Clear the browser’s cache.
-
Use a private browsing window.
-
Try a different browser.