--- category: [Administration & Integrations, Platform and Product Extensions, Platform and Product Extensions/Integration, Administration & Integrations/Custom Integrations & Apps, Platform and Product Extensions/Workday Extend] keyword: [Extend, Presentation Components, widgets, tags, UI components] nav: wcp_docs parent_url: /wcp_docs/ title: fieldSet layout: subsection wd_wcptag: fieldSet --- A vertical (default) or horizontal group of related widgets with a title. Use a `fieldSet` on edit or view pages. Jump to: - [Mobile Support](/wcp_docs/qim1518457781328.html#section-mobile-support) - [Attributes](/wcp_docs/qim1518457781328.html#section-attributes) - [PMD Scripting Methods](/wcp_docs/qim1518457781328.html#section-pmd-scripting-methods) ## Usage ## Adding a Title A `fieldSet` is a section with a `title`. Use a `fieldSet` if the section of widgets needs a title or heading, in addition to the individual widget labels. If the section of widgets doesn't need a title, use the `section` tag instead. ## Collapsing a fieldSet Use a `fieldSet` if you want a collapsible section of widgets. A collapsible `fieldSet` displays an arrow near the title, which the user can click to collapse or expand the section. By default, a `fieldSet` isn't collapsible. To make a `fieldSet` collapsible, set these attributes: - `collapsible` - Set to true. - `title` - The heading of the collapsible section. If you don't specify a title, the `fieldSet` won't collapse. - `initializeCollapsed` - (Optional) Set to true if you want to collapse the `fieldSet` when the page loads. By default, the page loads a collapsible `fieldSet` in expanded mode. ## Creating a Horizontal Layout To display horizontal widgets in a `fieldSet`, set the `horizontal` attribute to true. When you use a horizontal `fieldSet`, consider these guidelines: - You can't override the default column width ratios across the widgets. If you need to adjust the `columnWidthRatios`, use the `section` tag instead. - By default, the `fieldSet` doesn't display the `textArea` and `richText` tags horizontally with other tags. If you need to display a `textArea` or `richText` horizontally with other tags within a `fieldSet`, wrap each one in a nested `fieldSet`. Example: ``` { "type": "fieldSet", "id":"horizontalFieldSet", "title": "Horizontal fieldSet with a textArea", "horizontal": true, "children": [ { "type": "fieldSet", "id": "fieldSet1", "title": "Name", "children": [ { "type": "text", "id": "childText", "value": "Acme" } ] }, { "type": "fieldSet", "id": "fieldSet2", "title": "Amount", "children": [ { "type": "number", "id":"childNumber", "value": "1" } ] }, { "type": "fieldSet", "id": "fieldSet3", "title": "Additional Details", "collapsible": true, "children": [ { "type": "textArea", "id":"childTextArea", "value": "Enter your comments." } ] } ] } ``` - You can control the horizontal display and form aesthetics of a section by using the `layout` attribute. Its properties include: - `alignment`: Horizontal positioning. - `density`: Vertical spacing. - `horizontalSizing`: Widget stretching. - `labelPosition`: Label placement relative to the widget. For an example, see Creating a Horizontal Layout in [section](/wcp_docs/wjy1524108289078.html). For details, see `layout` in the Attributes section. ## Controlling Interdependent Widget Attributes Use a `fieldSet` to: - Control interdependent values or attributes within a group of widgets, when widget attributes (such as `visible`, `required`, `enabled`) might change due to the state of another widget. Note: Avoid nested fieldSets and minimize dynamic visibility. Although the fieldSet widget provides a handy way to group widgets and enable dynamic visibility, don't nest fieldSets within each other and minimize dynamic visibility. Nested fieldsets can easily introduce complex layers of dynamic visibility that cause inefficient rendering of the widgets. Nested fieldSets can also cause inconsistent results when referencing widgets across the different fieldSets. - Dynamically override the sequential order of tags in the PMD. By default, the widgets display in their coded order in the JSON. To reorder the widgets within a `fieldSet`: - Set the `sorted` attribute of `fieldSet` to true. - Set the `sortOrder` attributes of the child tags. The `sortOrder` attribute enables tag dependencies to work when the order doesn’t match the order of the coded tags in the PMD. ## Mobile Support Android, iOS ## Attributes - children Data type: list of tags An array of tags that belong to this parent tag. - collapsible Data type: binding-Boolean Indicates whether or not users can collapse the `fieldSet`. If you want the `fieldSet` collapsed on page load, set both this attribute and the `initializeCollapsed` attribute to true. - horizontal Data type: boolean If true, children tags display horizontally. - id Data type: binding-String Unique identifier used to reference this widget from other tags. Notes: - The `id` must start with a letter. - The `id` must be unique per page. - To enable other widgets to reference this widget `id`, place this widget before the other widgets on the PMD. The PMD validation returns an "Undefined variable" error if it doesn't find a previously defined `id` in the PMD. - Workday recommends that you include the `id` in your tag definitions for debugging purposes. - label Data type: dynamicBinding-String The tab label for a tab fieldSet. A tab `fieldSet` requires the `label` attribute. Note: The `label` only appears when the `fieldSet` is a tab. - layout Data type: `layout` object Contains properties that control the display of the widgets within the `fieldSet`. - Default: If `layout` is not specified, `fieldSet` displays the standard layout. - Inheritance: A nested `section` or `fieldSet` inherits the `layout` attributes of its parent section. - Overrides: A `layout` attribute in a nested `section` or `fieldSet` overrides any specified `layout` attribute in the parent fieldSet. The `layout` object contains these attributes: - alignment Data type: string Controls the horizontal alignment of the widgets in the `fieldSet`. Right-alignment is not available. Valid values: - `center` - The widgets are centered within the section. - `left` - (Default) The widgets display on the left side of the section. - density Data type: string Controls how tightly the tags are vertically displayed in the `fieldSet`. Valid values: - `low` - Least compact, with maximum vertical spacing between widgets. - `medium` - (Default) Medium vertical spacing between widgets. - `high` - Very compact, with minimal vertical spacing between widgets. - horizontalSizing Data type: string Controls how widgets are horizontally stretched across the `fieldSet`. Valid values: - `fixed` - (Default) The widgets horizontally display in a fixed width. - `stretch` - The widgets are fully stretched across the `fieldSet`. - labelPosition Data type: string Controls the position of the widget label. Valid values: - `top` - (Default) Displays on top of the widget. - `side_align_left` - Left-aligns the label on the left side of the widget. - `side_align_right` - Right-aligns the label on the left side of the widget. - initializeCollapsed Data type: binding-Boolean Determines whether or not to collapse the fieldSet on page load. If you want the fieldSet to collapse on page load, set both this attribute and the collapsible attribute to true. - render Data type: binding-Boolean If true, this tag renders as a widget on the page. If false, the loaded page doesn't add this tag or its children. The default is true. Unlike the `visible` attribute, when `render` is false, other tags on the page can't reference this tag or widget on edit pages. On view pages, a tag can't reference other tags regardless of the `render` attribute value. - sorted Data type: boolean If true, the `sortOrder` attributes in the child tags determine the sorted placement of this widget. Note that `sorted` doesn't apply to sorting data on the widget. `sorted` only applies to the placement order of the widgets within the parent widget. - sortOrder Data type: binding-String When you set `sorted` to true on the `section` or `fieldSet` parent of this widget, the `sortOrder` attribute determines the order of this widget within its parent. The sort order is relative to the siblings of the widget. Typical values are "a", "b", "c", and so on. Example: The widget with `"sortOrder": "a"` displays before the widget with `"sortOrder": "b"`. Note: The `sortOrder` doesn't apply to sorting data on the widget. `sortOrder` only applies to the placement order of the widgets within the parent widget. - title Data type: binding-String Text that displays at the top of the fieldSet. Use a section if you don’t need to display text. - visible Data type: dynamicBinding-Boolean If true, the widget generated by this tag is visible. If false, this tag and its children tags aren't visible. This tag provides the ability to display or hide the widget dynamically based on user interactions on the page. The default is true. Unlike the `render` attribute, the generated widget persists on the page even when `visible` is false. Notes: - When the widget or field you’re hiding changes on the page, you must include it inside a `fieldSet`. - When the `visible` attribute is false for this widget on an edit page, the outbound endpoint doesn't include the `valueOutBinding` or `valuesOut` data of the widget in the payload. To include the `valueOutBinding` or `valuesOut` data in the payload, use the `onSend` event handler. ## PMD Scripting Methods - anyUpdated() Return type: `boolean` Description: Determines if any descendant in this container widget is updated. - get(String childId) Return type: `Widget` Description: Returns the child widget with the specified tag `id` inside this container. The `get(childId)` method enables you to directly access the children of the `section` widget. Different ways to call the `get(childId)` method: - container.childId Example ``` mySection.textField.value = self.value; ``` - container['childId '] Example ``` mySection['textField'].value = self.value; ``` - container.get('childId ') Example ``` mySection.get('textField').value = self.value; ``` - getChildren() Return type: `List` Description: Returns all children of this container widget as a list. - getChildrenMap() Return type: `Map` Description: Returns a map containing all children of this container widget. The keys in the map are the ids of the children tags. - isVisible() Return type: `boolean` Description: Returns true if this widget is visible. - setVisible(boolean visible) Return type: `void` Description: Displays or hides this widget. If you need to change the visibility of a `section`, ensure that it's inside a `fieldSet`. - anyUpdated() Return type: `boolean` Description: Determines if any descendant in this container widget is updated. - get(String childId) Return type: `Widget` Description: Returns the child widget with the specified tag `id` inside this container. The `get(childId)` method enables you to directly access the children of the `fieldSet` widget. Different ways to call the `get(childId)` method: - container.childId Example ``` myFieldSet.textField.value = self.value; ``` - container['childId '] Example ``` myFieldSet['textField'].value = self.value; ``` - container.get('childId ') Example ``` myFieldSet.get('textField').value = self.value; ``` - getChildren() Return type: `List` Description: Returns all children of this container widget as a list. - getChildrenMap() Return type: `Map` Description: Returns a map containing all children of this container widget. The keys in the map are the ids of the children tags. - getTitle() Return type: `string` Description: Returns the title of the `fieldSet`. - isVisible() Return type: `boolean` Description: Returns true if this widget is visible. - setTitle(String title) Return type: `void` Description: Sets the title of the `fieldSet`. - setVisible(boolean visible) Return type: `void` Description: Displays or hides this widget. ### Related Information [Reference: When to Use section vs fieldSet](/wcp_docs/GUID-efbc531b-fac9-4e5a-a012-4b638453b34b-enHYPHENus.html)