8.8.7.9 Enabling Detail View in an Interactive Grid

Learn how to enable Detail View in an interactive grid.

Interactive grids support different views of data. By default, interactive grids display data in a Grid view. Developers can optionally display data as in a Detail view. Enabling Detail view adds an Detail button to the select view button group.

• About Detail View in an Interactive Grid
  Learn about interactive grid Detail View.
• Adding a Detail View to an Interactive Grid
  Learn how to enable Detail View in an interactive grid.

8.8.7.9.1 About Detail View in an Interactive Grid

Learn about interactive grid Detail View.

Interactive grids support different views of data. Users can switch between these views by clicking the buttons in the select view button group. The following illustration shows an interactive grid with Detail view enabled and the Detail button selected. Detail view displays column values using developer defined HTML markup as shown in the following illustration.

Description of the illustration ig_detail_view.png

8.8.7.9.2 Adding a Detail View to an Interactive Grid

Learn how to enable Detail View in an interactive grid.

To add a Detail view to an interactive grid:

1. View the page in Page Designer:
   Page Designer appears.
2. In the Rendering tab, select the region containing the interactive grid.
3. In the Property Editor, select the Attributes tab.
   The Property Editor displays the attributes. Attributes are organized in groups
4. In the Property Editor Attributes tab, find the Detail View group and edit the following:
   1. Show - Select On.
   2. Before Rows - Enter the HTML to be displayed before report rows.
   3. For Each Row - Enter the HTML template to use for each report row in the Detail View. Use #COLUMN_NAME# substitution strings for column names and column labels.

      The following substitution strings are available:

      • &COLUMN_NAME. - substitution strings for column labels and names.

      • &APEX$ROW_ID. - the record identifier for the row.

      • &APEX$ROW_INDEX. - the record display sequence number.

      Example:

      <tr><td align="right">&ENAME_LABEL.:</td><td>&ENAME.</td></tr> <tr><td align="right">&JOB_LABEL.:</td><td>&JOB.</td></tr>

   4. After Rows - Enter the HTML to be displayed after report rows.
5. To save your changes click Save. To save and run the page, click Save and Run Page.