Table layout - Presentation tab
Click the View properties icon in the Grid Repeat Layout header to display the Properties panel, and then select the Presentation tab.
Style | Specify a style for the grid. | ||||||||
Container format | Select a container format. You can create and modify accordion formats in the skin. | ||||||||
Width of content |
Select a grid-width option to determine whether the width of the individual
columns within the layout (action and repeating areas) are set as a percentage or in
pixel values. Use the options as follows:
|
Specify the grid height in the field that displays.
The UI Gallery contains working examples of Row Hover.
The UI Gallery landing page contains a working example of this element. To display the gallery, in Dev Studio, click
.You set the responsive behavior for your grid columns in the skin. Skin form - Components tab - Layouts - Trees & grids Skin form - Components tab - Layouts - Trees and tables - General tab
- Select the Section option and enter the name of your custom section.
- Select the Field Value option and enter the name of your custom field value.
Alternatively, you can save a customized version of the pyGridNoResultsMessage section or GridNoResultsOnLoad field value into one of your application rulesets.
- Select the Section option and enter the name of a custom section.
- Select the Field Value option and enter the name of a custom field value.
Alternatively, you can save a customized version of the pyGridNoResultsMessage section or GridNoResultsOnFiltering field value into one of your application rulesets.
Column Properties |
These are the properties for your grid columns that you open by selecting the
small circle in a column instance.
|
Header Settings | |
Title |
Optional. Type text to display in the accordion header or subheader. This text
may include directives or JSP tags, such as <p:r > or <pega:lookup >.
When you plan to localize the application using this rule, so the application can support users in various languages or locales, choose the text carefully and limit the length to no more than 64 characters. When practical, choose a caption already included in a language pack, to simplify later localization. A field value rule with this text as the final key part is needed for each locale. See About the Localization wizard. |
Heading level | Select a heading level from the drop-down menu. The container heading level generates semantic markup and makes the UI structurally understandable for assistive technology users. |
Include icon with title | Select if you want to include an icon in the title bar. |
Icon | Optional. Click the Show Image Viewer icon to open the Image Library landing page and select an image to include on the left side of the header. |
Icon title | If you want to display a tooltip when the user hovers the mouse pointer over the icon, type a text string within quotations, for example, "Select to view list". |
Body visibility | Optional. Leave blank to present the body always. To control visibility of the
body, enter or select one of the following:
As a best practice, use the Condition Builder to edit this field. Click the Open condition builder icon to open the tool. |
Run visibility condition on client | Appears when you select Conditional Visibility and enter a simple expression in the field that displays. Select the Run visibility condition on clientcheck box to cause dynamic execution of the condition each time the value of a property stated in the condition changes. Conditions are automatically re-evaluated when the user updates a property value. By default, controls that allow typing, such as Text Input, are evaluated when the user leaves the field. To re-evaluate conditions as the user types, use the Apply Conditions action with a Keyboard event. See Control Form - Completing the Control tab. |
Defer load contents |
Optional. Choose this option to delay loading at runtime of the section
content until the user clicks the header. Deferring enables users to start using
other parts of the page rather than waiting for this section to load.
To enable users to take actions, such as submit, on a work item while other content is still being loaded, configure sections to use defer loaded asynchronous declare pages. See Pega Community How to configure non-blocking UI using Asynchronous Declare Pages (ADP). |
Specify a pre-loading activity | Optional. If Defer Load? is selected, you can specify an activity to be run when the container is expanded by a click. This activity can compute property values and other aspects of the expanded container. As a best practice, create a defer loaded wrapper section with the retrieval activity (instead of having multiple defer loaded sections with wrapper activities.) |
Previous topic Table layout structure Next topic Table layout - Operations tab