8.3.1 Managing Interactive Grid Region Attributes

Each page in an Oracle Application Express application contains one or more regions. A region is an area on a page that serves as a container for content such as an interactive grid. Developers can edit region attributes to alter the SQL source, change the region layout and appearance, define a region displays selector, and create region conditions.

Topics:

8.3.1.1 Editing Interactive Grid Region Attributes

To edit region attributes in Page Designer:

View the page in Page Designer:
1. On the Workspace home page, click the App Builder icon.
2. Select an application.
3. Select a page.
Page Designer appears.
In the Rendering tab, select the region.

The Property Editor displays the region attributes in the right pane.

Description of the illustration GUID-22142F4E-376D-43F3-965A-5DD7F317F98F-default.png

Attributes are organized into functional groups. To expand or collapse these groups, click the Show Common, Show All, Collapse All, and Expand All icons.
To search for an attribute, enter a keyword search in the Filter Properties field.

The groups and attributes containing the term appear.
Edit the appropriate attributes.

Tip:

To view help for an attribute, select the attribute in the Property Editor and click the Help tab in the central pane.
To save your changes click Save. To save and run the page, click Save and Run Page.

8.3.1.2 Creating Master Detail from an Existing Interactive Grid

A single page master detail features two editable interactive grids based on two related tables or views. If you have an existing interactive grid, you can add another related interactive grid by doing the following:

Create the parent interactive grid.
Define the primary key (if needed).
Create the child interactive grid.
For the child interactive grid, specify the Master Region and Master Column.

The following example demonstrates how to create an interactive grid on the departments table, EBA_DEMO_IG_DEPT by running the Create Page Wizard. This wizard creates the parent interactive grid and enables you to define the primary key. Then, you create a child interactive grid on the employees table, EBA_DEMO_IG_EMP.

To add a related interactive grid below an existing grid:

Create an application.
Run the Create Page Wizard. On the Application home page, click Create Page
In the Create Page Wizard:
1. Select a Page Type - Select Report and then select Interactive Grid.
2. Page Attributes - For Page Name enter Departments and click Next.
3. Navigation Menu - Accept the defaults and click Next.
4. On Report Source:
  - Editing Enabled - Select Yes.
  - Table / View Name - Select EBA_DEMO_IG_DEPT.
  - Primary Key Column - Select DEPTNO (Number).
  - Click Create.
Page Designer appears.
Click Save and Run Page to view a rendered version of the parent interactive grid.

This following illustration shows an editable interactive grid created on the EBA_DEMO_IG_DEPT table.

Description of the illustration GUID-60F9F939-9366-43D3-AABF-1F024D22857F-default.png
Return to Page Designer. Click Edit Page X on the Runtime Developer toolbar.
Create the child interactive grid on the EBA_DEMO_IG_EMP table:
1. In the Gallery, locate the Regions tab.
2. Under Regions, right-click Interactive Grid.
3. Select Add To, Content Body, the region, Departments, and then After.
  
  The Rendering tab and Layout tab both display a a new region in red.
  
  Description of the illustration GUID-FE7D20EE-AC4C-4C4B-BF76-563E3F9BC5C9-default.png
Edit the New child region:
1. In the Rendering tab, select the New region.
2. In the Property Editor, edit the region attributes:
  
  Note:
  
  To search for an attribute, enter search terms in Filter Properties field at the top of the Property Editor.
  - Identification, Title - Enter Employees.
  - Source, SQL Query - Enter the query:
```
select EMPNO,
       ENAME,
       JOB,
       MGR,
       HIREDATE,
       SAL,
       COMM,
       ONLEAVE,
       DEPTNO
from EBA_DEMO_IG_EMP
```
  - Layout, Start New Row - Select Yes.
  - Appearance, Template - Select Standard
  - Master Detail, Master Region - Select the region, Departments.
For the Child Interactive Grid, define DEPTNO as the Master Column:
1. In the Rendering tab, under Child Interactive Grid, expand the Columns node and select DEPTNO.
2. In Property Editor, edit the following:
  - Master Detail, Master Column - Select DEPTNO.
Click Save. To run the page, click Save and Run Page.

Description of the illustration GUID-55603D51-7868-4974-BEFD-44BD36C9C2A0-default.png
Note that parent, Department, filters the results in Employees, the child.

Next, make the child, Employees, editable.
To make the child, Employees editable:
1. Access Page Designer. Click the Edit Page XX on the Developer Toolbar.
2. In the Rendering tab, under Employees, select Attributes.
3. In the Property Editor, edit the following:
  - Edit, Enabled - Select Yes.
  - Allowed Operations - Verify the following operations are enabled: Add Row, Update Row, and Delete Row.
Click Save. To run the page, click Save and Run Page.

Description of the illustration GUID-45A95E96-7783-4AF4-AD69-369D94ABDEBA-default.png
The child interactive grid, Employees, is now editable

8.3.1.3 Displaying Interactive Grids Conditionally

You can choose to have interactive grids display conditionally by editing region attributes.

To display an interactive grid conditionally:

View the page in Page Designer:
1. On the Workspace home page, click the App Builder icon.
2. Select an application.
3. Select a page.
Page Designer appears.
In the Rendering tab, select the region.
The Property Editor displays the region attributes in the right pane.
In the Property Editor click the Collapse All icon and then locate and expand Server-side Condition.
For Type, select a condition type and follow the on-screen instructions.

When you edit attributes in Page Designer, the Messages tab displays errors and warnings you need to address. The Messages tab displays a red or yellow badge indicating the number of messages you need to address. Click the Messages tab to review the messages.

Tip:

To view help for an attribute, select the attribute in the Property Editor and click the Help tab in the central pane.
To save your changes click Save. To save and run the page, click Save and Run Page.