Table layout - Operations tab

Click the View properties icon in the Grid Repeat Layout header to display the Properties panel, and then select the Operations tab.

Row operations

Row editing

The row editing mode sets the default presentation and behavior configuration for a grid, determining how users view and edit properties.

For Inline and Master-detail row editing options, the default behaviors are available on the Actions tab. See Actions tab and the Actions tab for more information.
Option Description
None Select this option if the row's data cannot be edited. You can allow the user to display the flow action's fields by selecting the Show details option on this tab, under Grid operations.
Note: If the data source is a Report Definition, this is the default value and cannot be edited. You can add action buttons to the grid, which gives the user access to actions on the object represented by that row, such as opening a work item or a local flow action.
Inline Select to enable inline editing of the row's data.
Inline edit mode Available when you select Inline. Select an inline edit mode:
  • Click a row to edit - when the user double-clicks a row, the specified fields in that row display as editable.
  • Rows always editable - editable fields display the data in input boxes.
Master-detail Select to enable the user to edit the details of a master object. The user can navigate between master objects and make changes to details without leaving the page.
Editable in modal Editable in modal options are available when the Optimize code check box is selected on the General tab.
Display of details Select a way to display row details when a user clicks a row:
  • Modal dialog - the editable fields for the flow action appear in a modal window on top of the data display. When the modal window is dismissed, the edits are applied.
  • Expandable rows - the editable fields for the flow action populate a detail area below the selected row. When the user saves the edits or selects another row, the edits are applied.
  • Embedded elsewhere - the editable fields for the flow action populate a detail area below the grid. When the user saves the edits or selects another row, the edits are applied.

Click Open template to open the section used to render the layout. When the Optimize code option is selected on the General tab, the pyNextGenGridModalTemplate will open.

By default, the templates are standard rules .pyGridModalTemplate, .pyGridRowDetails, and .pyGridDetails, respectively. To create custom templates, copy these rules into your Applies To class. Do not change the Purpose.

Modal format Available only when the Optimize code option is selected on the General tab. Select a format for the modal dialog. The default is Standard. To specify a custom format defined in the skin, select Other. Press the Down Arrow in the field that displays to select the format that you want to use.
Detail flow action Available when you select:
  • Master-detail as the Row editing operation
  • None as the Row editing operation together with the Show details check box, under Grid operations
Press the Down Arrow in the Detail flow action field to select the flow action that will provide the form for the modal dialog or detail area that appears when the user clicks a row.
Display details read-only Available when you select Master-detail as the Row editing operation. Not available when Editable in modal is selected together with the Optimize code check box on the General tab.

Select to allow the user to view the flow action details in read-only mode, which prevents locking the work item ( Work- or Assign- item) when it opens.

Do not select this option if the flow action contains an editable grid. The user will be unable to perform work in it.
Display an expand/collapse icon per row Available when you select:
  • Master-detail as the Row editing operation together with Expandable rows to display details.
  • None as the Row editing operation together with the Show details check box, under Grid operations

Select to display an Expand/Collapse column at the far left of the grid at runtime. The column displays an icon in each row of the grid.

The Expand/Collapse column is optional; users can click in the row to expand or collapse the pane, or you can insert a button, icon, or link anywhere in the row to enable expand and collapse. If you deleted the default Edit Item action from the Expand Pane edit mode, then select this column to use Expand Pane.
Details location Available when you select Master-detail as the Row editing operation together with Expandable rows to display details.

Select Default, to display details after the grid, or select In place of a section to specify the section in which you want the details to appear. For example, assume you want the detail area to appear to the right of the grid instead of below it (default). Create a section (named gridResults ) containing a two-column layout. Embed the grid in the first column and an empty section in the second column. Specify the name of the empty section here.

Grid operations

Checkbox Description
Allow column sorting (Additional settings on column) Select to allow users to sort the rows on a column in the grid. This setting applies to all columns. You can disable sorting for individual columns by clearing the Enable sorting check box in a column's Cell properties panel. Sorting is not available for columns containing images, or controls such as buttons (but can include links). This setting overrides the Sort type settings on Report Definition form's Design tab. For instance, if there are no settings that form, the Sorting selection here enables sorting on the grid.

A tool tip appears at runtime when the user hovers the mouse pointer over the column header. Clicking the header sorts the rows in the column. When sorted, an icon indicating an ascending or descending sort order appears to the right of the header label text. The user can alternate the sort order by clicking the header again. You can use the Skin rule to replace the default icons.

Sorting is performed on all rows in the grid. If Paging is enabled and the user changes the sort order, the grid view returns to the first page.

Allow filtering (Additional settings on column) Select to allow users to show only those rows that match a column value filter. This setting enables filtering for all columns that include a property. You can set filter types or disable filtering for individual columns using the Filtering options in the Column properties panel.

If a column can be filtered, a filter icon appears on the right side of the column's header cell. The user clicks the icon to display the filter pop-up menu. The user can select check box next to a property that is to be included in the filter or enter a text, or combine the two methods and click Apply.

You can use the Skin rule to replace the default icons.
  • Columns containing images, most action controls such as buttons or icons, hidden controls (pxHidden), prompt select controls, and subsections cannot be filtered. Columns can include links.
  • Filtering on Text properties that are obfuscated in edit-mode return results based on unfiltered data. Filtering should be disabled.
  • For date types, leaving a From or To field blank means to include everything preceding or following the single limit. For example, if you enter From 12/15/2011 and leave To blank, all dates on or after 12/15/2011 are included.
  • For numeric types, leaving a greater than or less than field blank means to include everything preceding or following the single limit. For example, if you enter less than 500 and leave greater than blank, all numbers less than 500 are included.
  • The following property types cannot be filtered:
    • TextEncrypted
    • Password
    • TimeOfDay
    • Identifier

If the filter does not produce results, a message appears. You can modify the message text in the section pyGridNoResultsMessage.

Allow filtering on unexposed properties Available when you select Allow filtering. Select to allow filtering on unexposed columns.
Display selected filter values first Available when you select Allow filtering. When selected, the names of the columns selected for filtering are listed at the top of the filter panel.

This option is enabled by default when the Optimize code option is selected on the General tab although this check box will not appear.

Allow row reordering Select to allow users to move objects higher or lower on the display by dragging and dropping individual rows. Depending on the properties of the objects the rows represent, rows may be moved above or below other rows, or dropped into a row that can receive them to become child entries of that row.
Note: Unavailable if source is Report Definition.
Visual indicators give clues about the process: a line appears between two rows in the list if that is where the row you have started dragging will appear if you release it. A row that can receive the row you have selected as a child will change background color. If your mouse pointer is over an area where you cannot drop the row you have selected, an indicator will remind you that the area is not a valid target. If you attempt to drop the row there, the display will remain unchanged.
Allow column resizing Select to allow users to adjust the width of columns on the display by dragging individual columns to the left or right.
Categorize grid rows (Additional settings on column) Avaliable when the source of the grid (specified on the General tab) is a Report Definition and the Row editing operation on the Operations tab is None.

Select if you want categorize grid rows based on columns within the grid. You can select the columns by which you want to categorize the grid, and specify sorting and ascending or descending order on the column properties panel of the column within the grid.

Note: Categorizing all columns within a grid would not yield any data columns at runtime.
Use custom category template Available when you select the Categorize grid rows check box. By default, the pzGridCategoryHeader template is applied.

Select this check box if you want to specify a custom category template in the field that displays.

Show details Select to allow the user to click a row and display its flow action details beneath the row in read-only mode. The user can expand multiple rows. Enter the flow action in the Flow action field.
Allow refresh on update When checked, the entire layout is refreshed each time data is updated or submitted.
Select first row on initial load Available when you select Master-detail as the Row editing operation and select to display details in Embedded elsewhere.

Select this check box if you want the first row to display as selected when the grid initially loads.

Enable displaying details on multiple rows Available when you select Master-detail as the Row editing operation and select to display details in Expandable rows.

Select to enable users to expand more than one row at a time.

Expand all Available when Show details is selected. Select to display details for all rows when the user opens the form.

Advanced

Check box Description
Run activity on row add Select this checkbox to start an activity when a row is added.
  1. In the Run activity on row add field, press the Down Arrow to select an activity that you want to associate with this action.
  2. Open the previously selected activity and add a step that adds a row to the list.
    Note: For example, you can call AppendToPageList activity in that step and select the Pass the current parameter page checkbox.
Run activity on row delete Select this checkbox to start an activity when a row is deleted
  1. In the Run activity on row delete field, press the Down Arrow to select an activity that you want to associate with this action.
  2. Open the previously selected activity and add a step that deletes a row to the list.
    Note: For example, you can call RemoveFromPageList activity in that step and select the Pass the current parameter page checkbox.

Actions tab

About Grid Actions

Depending upon the row editing format you choose, you may see actions defined by default, on the Actions tab. These actions determine how users view and edit data in the grid.

If you select Master-detail as the Row editing option, the following actions are defined by default:

Row editing Description Default Actions
Modal dialog The displayed data appears as in read-only mode. When the user clicks a row, the editable fields for the flow action appear in a modal window on top of the data display. When the modal window is dismissed, the edits are applied.
  • Click: Set Focus
  • Double Click: Edit Item
Embedded elsewhere The displayed data appears as in read-only mode. When the user clicks a row, editable fields for the flow action populate a detail area below the grid. When the user saves the edits or selects another row, the edits are applied.
  • Click: Set Focus
  • Click: Edit Item
Expandable rows The displayed data appears as in read-only mode. When the user clicks a row, the flow action's editable fields populate a detail area below the selected row. When the user saves the edits or selects another row, the edits are applied.
  • Click: Set Focus
  • Click: Edit Item

The system uses existing grid actions to determine whether to set focus to new rows. When adding a new row, if focus is configured for the grid, then the system sets focus to the new row.

If you select Edit in modal as the Row editing option when the Optimize code check box is selected on the General tab, the following actions are defined by default:

Row editing Description Default Actions
Modal dialog The displayed data appears as in read-only mode. When the user clicks a row, the editable fields for the flow action appear in a modal window on top of the data display. When the modal window is dismissed, the edits are applied.
  • Click: Set Focus
  • Click: Edit Item

When configuring actions in a repeating grid, on the Actions tab, select actions from a List category.

You can configure sequential actions based on a single event for a repeating grid; for example, Click to Set Focus and Click to Edit Item. The actions are acted upon in the order specified. You can set multiple actions based on different events; for example, Click to Set Focus and Double Click to Edit Item.

You can also configure Keyboard actions to enable users to navigate and access items in a repeating grid. For example, you can configure the Up and Down arrows to set focus to the previous and next rows in a grid, and the Enter key to open the selected item.

If you want to set focus from within a row in a repeating grid to an editable control outside of the grid, provide the full path to the property, beginning with the parent page, and represent it on the Pages & Classes tab of the layout containing the repeating grid.

UI Gallery

The UI Gallery landing page contains a working example of this element. To display the gallery, in Dev Studio, click Configure > User Interface > Gallery > UI elements.