Managing Interactive Grid Region Attributes

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

• Editing Interactive Grid Region Attributes
  
• Creating Master Detail from an Existing Interactive Grid
  
• Displaying Interactive Grids Conditionally
  

See Also:

"Editing Pages in Page Designer"

Editing Interactive Grid Region Attributes

To edit region attributes in Page Designer:

1. 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.
2. In the Rendering tab, select the region.

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

   
   Description of the illustration ig_region_attributes.png

   Use region attributes to alter the SQL source, change the region layout and appearance, create a master detail, define a region displays selector, or create conditions.

3. To find a group or attribute:
   • Search for the group or attribute - Enter keywords in the Filter Properties field. The Property Editor displays the group or attributes. To return to the default display, delete the keywords.
   • Use Go to Group - Click Go to Group and select the group. To return the default display, click Go to Group again and select Expand All.
4. 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.

5. To save your changes click Save. To save and run the page, click Save and Run Page.

See Also:

"Right Pane of Page Designer (Property Editor)"

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. You can define any number of master detail relationships on a single page by simply adding a related interactive grid to the page. 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, OEHR_DEPARTMENTS 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, OEHR_EMPLOYEES.

To add a related interactive grid below an existing grid:

1. Create an application.
2. Run the Create Page Wizard. On the Application home page, click Create Page
3. 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 - Select how you want this page integrated into the Navigation Menu and click Next.
   4. On Report Source:

      • Editing Enabled - Select Yes.

      • Source Type - Select Table.

      • Table / View Name - Select OEHR_DEPARTMENTS (table).

      • Primary Key Column - Select DEPARTMENT_ID (Number).

      • Click Create.

      Page Designer appears.
4. 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 OEHR_DEPARTMENTS table.

   
   Description of the illustration master_detail_parent.png
5. Return to Page Designer. Click Edit Page X on the Runtime Developer toolbar.
6. Create the child interactive grid on the OEHR_EMPLOYEES table:
   1. In the Gallery, locate the Regions tab.
   2. Under Regions, find and then 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 master_detail_new_child_region.png
7. Edit the New child region:
   1. In the Rendering tab, select the New region (if not already selected).
   2. In the Property Editor, edit the region attributes:

      Note:

      To find a group or attribute, enter keywords in the Filter Properties field. The Property Editor displays the group or attributes. To return to the default display, delete the keywords.

      • Identification, Title - Enter Employees.

      • Source, SQL Query - Enter the query:

        select OEHR_EMPLOYEES.EMPLOYEE_ID as EMPLOYEE_ID,
            OEHR_EMPLOYEES.FIRST_NAME as FIRST_NAME,
            OEHR_EMPLOYEES.LAST_NAME as LAST_NAME,
            OEHR_EMPLOYEES.HIRE_DATE as HIRE_DATE,
            OEHR_EMPLOYEES.EMAIL as EMAIL,
            OEHR_EMPLOYEES.PHONE_NUMBER as PHONE_NUMBER,
            OEHR_EMPLOYEES.JOB_ID as JOB_ID,
            OEHR_EMPLOYEES.SALARY as SALARY,
            OEHR_EMPLOYEES.DEPARTMENT_ID as DEPARTMENT_ID 
         from OEHR_EMPLOYEES

      • Layout, Start New Row - Select Yes.

      • Appearance, Template - Select Standard

      • Master Detail, Master Region - Select the region, Departments.

8. For the child interactive grid, Employees, define DEPARTMENTS as the Master Column:
   1. In the Rendering tab, under the child interactive grid, Employees, expand the Columns node and select DEPARTMENT_ID.
   2. In Property Editor, edit the following:

      • Find Master Detail.

      • For Master Column, select DEPARTMENT_ID.

9. Click Save. To run the page, click Save and Run Page.
   
   Description of the illustration master_detail_run.png

   Note that parent, Department, filters the results in Employees, the child.

   Next, make the child, Employees, editable.

10. Make Employees report 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.

11. Define the EMPLOYEE_ID column as the Primary Key Column:
    1. In the Rendering tab, under Employees, expand Columns and select EMPLOYEE_ID.
    2. In the Property Editor, find Source, Primary Key and select Yes.
12. Click Save. To run the page, click Save and Run Page.

    The child interactive grid, Employees, is now editable

    
    Description of the illustration master_detail_editable.png

Displaying Interactive Grids Conditionally

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

To display an interactive grid conditionally:

1. 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.
2. In the Rendering tab, select the region.
   The Property Editor displays the region attributes in the right pane.

   Tip:

   To find a group or attribute, enter keywords in the Filter Properties field. The Property Editor displays the group or attributes. Or, you can click Go to Group and select the group.

3. Edit Server-side Condition:
   1. Find the Server-side Condition group.
   2. 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.

4. To save your changes click Save. To save and run the page, click Save and Run Page.