Руководство Oracle APEX Tabular Form

Введение
Создать Tabular Form используя Wizard
Создать Tabular Form вручную
Обработка Tabular Form
Master-Details
Возможно вас интересует

1. Введение

Вы смотрите инструкцию программирования Oracle APEX 5.0. Это 2-ая статья, которая за статьей:

Руководство Oracle APEX для начинающих (APEX 5.0)

В данной статье я продолжу с Oracle APEX Database Desktop Application, используя Tabular Form.

2. Создать Tabular Form используя Wizard

Войти в систему Oracle APEX с аккаунтом программиста.

http://localhost:8080/apex

Войти в "Database Application".

Далее войдите в "Hello Database Desktop Application" который вы создали в предыдущей статье инструкции.

В данном приложении имеется несколько страниц созданных с предыдущей статьи инструкции. Нажмите на "Create Page" чтобы создать другую страницу.

Создать Tabular Form:

Ввести:

Page: 7
Page Name: Emp Tabular Form (7)

Ваша веб страница создана, нажмите на RUN чтобы запустить созданную страницу.

Изображения страницы 7 при запуске.

Здесь, поставленным вопросом является как поменять некоторые поля ввода (Input Fields) на SELECT LIST или POPUP LOV (List of values). Например: вы хотите выбрать Manager (MGR) через POPUP LOV, и выбрать Job через SELECT LIST.

Вернуться к экрану дизайна страницы 7. Настроить атрибуты для столбца JOB чтобы он отображался как список выбора (SELECT LIST).

Identification:

Type: Select List

List of Values

Type: Static Value
Static Value:

STATIC:
CLERK;CLERK,
SALESMAN;SALESMAN,
PRESIDENT;PRESIDENT,
MANAGER;MANAGER,
ANALYST;ANALYST

Синтаксис объявления статистических значений (Static Values):

STATIC:Display1;Return1,Display2;Return2

Далее вам нужно настроить атрибуты для поля MGR чтобы он отображался в виде POPUP LOV (List of values)

Identification:

Type: Popup LOV (shows display values)

List of Values:

Type: SQL Query
SQL Query: Select emp.ename, emp.empno from Emp

Индентично настройте атрибуты для DEPTNO, Чтобы он отображался как POPUP LOV.

Identification:

Type: Popup LOV (shows display values)

List of Values

Type: SQL Query
SQL Query: Select d.dname, d.deptno from Dept d

Save и перезапустить страницу 7:

3. Создать Tabular Form вручную

Выше я показал вам как создать Tabular Form используя wizard в Oracle Apex. Далее мы создадим Tabular Form с самого начала, не используя Wizard, это поможет вам лучше понять про Tabular Form & Oracle APEX.

Ввести:

Page Number: 8
Name: Emp Tabular Form (8)

Создана пустая страница.

Создать Tabular Form в регионе "Content Body":

Title: Emp Tabular Form (8)
Type: Tabular Form
SQL Query:

select EMPNO,
       EMPNO EMPNO_DISPLAY,
       ENAME,
       JOB,
       MGR,
       HIREDATE,
       SAL,
       COMM,
       DEPTNO
  from EMP

Вы можете протестировать страницу 8, полученные результаты:

Добавьте столбец содержащий CheckBox, который используется для выбора строк.

Настроить атрибуты для EMPNO, скрыть этот столбец, и настроить для него атрибуты primary key.

Identification

Column Name: EMPNO
Type: Hidden Column (saves state)

Primary Key Source

Type: Existing sequence
Name: EMP_SEQ

Столбец ENAME:

Identification

Column Name: ENAME
Type: Text Field

Столбец JOB:

Identification

Column Name: JOB
Type: Select List

List of Values

Type: Static Values
Static Values:

STATIC:
CLERK;CLERK,
SALESMAN;SALESMAN,
PRESIDENT;PRESIDENT,
MANAGER;MANAGER,
ANALYST;ANALYST

Столбец MGR:

Identification

Column Name: MGR
Type: Popup LOV (shows display values)

List of Values

Type: SQL Query
Static Values: Select emp.ename, emp.empno from Emp

Столбец HIREDATE:

Identification

Column Name: HIDEDATE
Type: Date Picker

Appearance

Format Mask: YYYY-MM-DD

Default

Type: PL/SQL Expression
PL/SQL Expression: sysdate

Столбец SAL:

Identification

Column Name: SAL
Type: Text Field

Столбец SAL (Salary) это числовые данные, поэтому вам нужно добавить проверку:

Identification

Name: SAL must be numeric

Validation:

Type: Column is numeric
Column: SAL

Error

Error Message: #COLUMN_HEADER# must have a value.
Display Location: Inline with Field and in Notification

Примечание:

# COLUMN_HEADER # - это тот, который действует как держатель места (Place Holder), он будет заменен заголовком соответствующего столбца во время выполнения.

Столбец COMM:

Identification

Column Name: COMM
Type: Text Field

Создать Validation для COMM, COMM должен иметь числовое значение.

Identification

Name: COMM must be numeric

Validation:

Type: Column is numeric
Column: COMM

Error

Error Message: #COLUMN_HEADER# must have a value.
Display Location: Inline with Field and in Notification

Столбец DEPTNO:

Identification:

Type: Popup LOV (shows display values)

List of Values

Type: SQL Query
SQL Query: Select d.dname, d.deptno from Dept d

4. Обработка Tabular Form

Далее нам нужно добавить обработки включая создание, изменение, удаление записей.

Изменить названия Button, как в изображении ниже:

Обработка для кнопки Cancel:

Когда пользователь нажимает на кнопку Cancel, веб страница refresh (обновит) настоящую страницу (Здесь это страница 8).

Обработка добавления записи

Когда пользователь нажимает на кнопку ADD, table на странице автоматически добавит новую строку, позволяющую пользователю вводить данные. Вам нужно вызвать функцию javascript чтобы выполнить это.

Idetification

Button Name: ADD
Label: Add

Behavior

Action: Redirect to URL
Target: javascript:apex.widget.tabular.addRow();

Обработка сохранения строк данных

Idetification

Button Name: SAVE
Label: Save

Behavior

Action: Submit Page

Кнопка SAVE должна выполнять обязанность сохранения информации разных записей одновременно, включая новые записи, измененные записи. Вам нужно объявить процесс (Process) для обработки. Этот Process будет сразу запущен после того как вызвана страница, он update (обновит) записи с изменениями и insert .

Создать новый Process:

Idetification

Name: ApplyMRU
Type: Tabular Form - Multi Row Update

Settings

Table Name: EMP
Primary Key Column: EMPNO

Execution Options

Tabular Form: Emp Tabular Form (8)
Run Process: Once Per Page Visit (default)

Success Messages

Success Message: #MRU_COUNT# row(s) updated, #MRI_COUNT# row(s) inserted.

Condition

When Button Pressed: SAVE (Name of button)
Execution Scope: For Created and Modified Rows

Обработка немедленного удаления нескольких строк

Обработка кнопки для немедленного удаления выбранных записей без необходимости подтверждения:

Чтобы удалить много строк вам нужно создать процесс (Process) для данной обработки. Этот Process будет выполнен один раз сразу при вызове веб страницы.

Создать новый Process:

Idetification

Name: ApplyMRD_IMMEDIATELY
Type: Tabular Form - Multi Row Delete

Settings

Table Name: EMP
Primary Key Column: EMPNO

Execution Options

Tabular Form: Emp Tabular Form (8)
Run Process: Once Per Page Visit (default)

Success Messages

Success Message: #MRD_COUNT# row(s) deleted.

Condition

When Button Pressed: IMMEDIATELY_MULTY_ROW_DELETE (Name of button)
Execution Scope: For Created and Modified Rows

Обработка удаления многих строк - Запрос перед удалением

Перед тем, как удалить записи, программа спрашивает согласен ли пользователь удалить или нет, перед тем как выполнить команду удаления.

Idetification

Button Name: MULTI_ROW_DELETE
Label: Multi Row Delete

Behavior

Action: Redirect URL
Target: javascript:apex.confirm('Are you sure to delete?','MULTI_ROW_DELETE');

apex.confirm(...) это функция Javascript использующаяся для того, чтобы спросить пользователя перед тем как выполнить команду button.

// The function includes 2 parameters, message and Button Name.

apex.confirm('Message ...', 'Button Name');

// Example:

apex.confirm('Are you sure to delete?','MULTI_ROW_DELETE');

// Using variable.
// htmldb_delete_message is a javascript variable
// with value: 'Would you like to perform this delete action?'
// (You need to declare this variable).
apex.confirm(htmldb_delete_message,'MULTI_ROW_DELETE');

// Declare a variable named htmldb_delete_message
var htmldb_delete_message='Would you like to perform this delete action?';

// Or:
// "DELETE_CONFIRM_MSG" is a constant available in APEX.
// It has value: Would you like to delete this thực action?


var htmldb_delete_message='"DELETE_CONFIRM_MSG"';


// Then can use this variable in the whole page.

apex.confirm(htmldb_delete_message,'MULTI_ROW_DELETE');

Чтобы удалить много строк вам нужно создать процесс (Process) обработки. Этот Process будет выполнен один раз сразу при вызове веб страницы.

Idetification