Le Tutoriel de Oracle APEX pour débutant (APEX 5.0)

• Installer Oracle Apex 5.0

Si vous utilisez Oracle 12c, le nom du Schema peut être commencer par ##. Par exemple ##DEV.

• Workspace: DEV_WORKSPACE
• User Name: devadmin
• Password: devadmin123

Dans la première fois que vous vous connectez au Workspace, le système vous oblige à modifier votre mot de passe, mais vous pouvez garder votre mot de passe intact.

Vous pouvez vous connecter à l'espace du travail (Workspace) DEV_WORKSPACE

• Desktop Application
• Websheet Application
• Mobile Application

Pour un débutant Oracle APEX, il est préférable d'avoir un exemple avec Database Desktop Application. En fait, cette application fonctionne toujours sur le Web, mais son interface est assez similaire à une application de Desktop typique.

Dans ce document, je vous donne des instructions pour que vous puissiez créer une application Hello World Oracle Apex sous forme Database Desktop Application.

Créer Database Desktop Application

Dans cette partie, nous allons créer une nouvelle Database Desktop Application:

Cliquez sur le bouton Create pour créer une nouvelle application:

Saisissez le nom de votre application:

• Hello Database Desktop Application

Par défaut, la page Home est créée simultanément avec l'application. Vous pouvez ajouter d'autres pages à l'application en cliquant sur "Add Page". Il est préférable de les ajouter plus tard.

Votre application a été créée. Son ID est 115 et il a deux pages Login & Home.

Actuellement, la page Home n'a pas été conçue. Cependant, vous pouvez cliquer sur l'icône pour tester le web.

Créer votre première page

Ensuite, nous ajoutons une page affichant une liste de départements (tableau DEPT) et une page utilisée pour créer et modifier l'information des départements. Pour être simple, nous créons cette page sous la forme d'un modèle d'Oracle APEX disponible. Dans la partie suivante, je vais vous demander de créer une nouvelle page à partir d'une page vierge afin que vous puissiez bien comprendre le problème.

Sélectionnez "Form on a Table with Report". Avec ce modèle Oracle APEX vous fournira deux pages qui incluent une page de la liste des départements (DEPT) et une forme de création (et d'édition) d'informations des départements.

D'abord, Oracle APEX ous oblige à saisir les informations de la page contenant la liste des départements (DEPT). Page Number est un attribut important que vous devez rappeler. J'accorde Page Number = 2 de cette page. (Remarque: la page d'accueil contient Page Number = 1).

Sélectionnez la table DEPT:

Saisissez des informations pour Menu:

• New Navigation Menu Entry: Dept List (2)

Choisissez des colonnes d'affichage:

Voici la page pour entrer les informations du département. Ici, j'assigne Page Number = 3.

Page Mode:

• Normal: Cela signifie que lorsque vous cliquez sur la création d'un nouveau département, le Web se déplacera vers une nouvelle page afin de pouvoir saisir les informations du département.
• Model Dialog: Cela signifie que lorsque vous cliquez sur la création d'un nouveau département, une boîte de dialogue s'affiche afin que vous puissiez saisir les informations.

Sélectionnez la colonne de clé primaire (Primary Key):

Lorsque vous créez un nouveau enregistrement DEPT, la colonne DEPTNO va être automatiquement attribuée une valeur par DEPT_SEQ sequence.

Deux pages ont été créées. Tout d'abord, procédez à un essai.

D'accord, tout est parfait. Revenez à l'écran de conception pour découvrir ce que Oracle APEX a créé.

Oracle APEX crée 2 pages sous forme du "Interactive Report" et "DML Form".

Cliquez sur la page "Form on DEPT (3)" pour éditer.

Dans l'image illustrative ci-dessus, vous verrez que l'écran de conception est divisé en trois parties:

• Les éléments de la page, y compris les régions (Regions), les boutons et le traitement (Processing),...
• L'interface de la page. Une page a habituellement six régions:

  • PAGE HEADER
  • PAGE NAVIGATION
  • BREADCRUMB BAR
  • CONTENT BODY
  • FOOTER
  • INLINE DIALOGS
• Lorsque vous sélectionnez un élément de la page comme indiqué dans la partie 1, ses attributs s'affichent dans la partie 3.

Exemple: Vous cliquez sur l'élément PAGE, et changez l'attribut de Page Mode en "Model Dialog". Et cliquez sur save, comme l'image de l'illustration ci-dessous:

Et réexécutez cette page web.

Une Dialog sera ouvrerte et elle vous permet de saisir l'information de nouveau département.

Créer une page à partir de zéro

Dans les parties ci-dessus, je vous ai présenté comment créer rapidement un Web avec des codes de traitement créés automatiquement par Oracle APEX. Afin de comprendre Oracle APEX beaucoup plus, dans cette partie, je recréerai l'exemple ci-dessus à partir de zéro sans utiliser les Template (modèles) disponibles d'Oracle APEX.

C'est le modèle de 2 pages que je vais créer:

• Create Page

Sélectionnez une page vierge:

La page de la liste des départements (DEPT) sera mise sur Menu.

Une page vierge a été créée. Nous créons la liste de départements, cette région sera incluse dans la section "Content Body".

Une nouvelle région (region) a été créée:

Saisissez l'information dans la région que vous venez de créer:

• Title: Dept List
• Type: Interactive Report
• Source SQL Query: Select DEPTNO, DNAME, LOC from DEPT
• SAVE

Maintenant, vous pouvez presse le bouton RUN () pour tester.

Vous devez ajouter une colonne contenant des icônes d'édition, comme indiqué ci-dessous:

Choisissez Attributes de la section "Dept List". Et définissez les propriétés comme indiqué ci-dessous:

Link Column = Link to Single Row View

Cela signifie que lorsque vous cliquez sur l'icône des enregistrements (modifier), l'application sautera sur une page par défaut (affiche les informations d'enregistrement)

Link Column = Link to Custom Target

Utilisez pour sauter à votre page personnalisée, pour afficher les informations d'enregistrement. (A mentionner plus tard).

Réexecutez votre page de web:

La page Web se tournera vers une page par défaut et affichera les informations que vous avez sélectionnées.

Form

Ensuite, nous créons une page Form, lorsque vous cliquez pour modifier ou créer un département, il se tournera vers cette page.

Une page vierge est créée, nous créerons une région contenant Form.

Saisissez les informations pour la nouvelle région qui vient d'être créer:

• Title: Form on Dept
• Type: Static Content

Remarque: Avec le type "Region Type = Static Content". Vous devez créer des Item dans cette région, et écrire les gestionnaires pour afficher et d'écrire des données de la bases de données.

Nous créerons 3 champs (field):

• Hidden: DEPTNO
• Text Field: DNAME
• Text Field: LOC

Glissez et déplacez un élément Hidden au zone ITEMS comme l'illustration ci-dessous.

Le réglement des propriétés pour Item:

Similairement, créez deux TEXT-FIELD:

Testez:

L'utilisateur sélectionne un enregistrement sur la liste (page 4) à modifier, il sera tourné vers la page Form (page 5) et passera l'ID de l'enregistrement. Vous devez effectuer un Process (en Pre-Rendering) à la page 5 pour charger les données et afficher Form:

Créer un Process dans:

• Pre-Rendering/After Header

Ce Process (Processus) sera appelé avant que la page est affichée.

Saisissez:

• Name: Fetch/load row From DEPT
• Type: Automatic Row Fetch
• Table Name: DEPT
• Primary Key Column: DEPTNO
• Primary Key Item: P5_DEPTNO

Retournez la page 4 (Dept List (4)) pour établir les paramètres passés de la page 4 à la page 5.

Save et tester la page web:

Ensuite, nous ajoutons de nouvelles fonctions de création et des fonctions de sauvegarde de l'enregistrement comme indiqué ci-dessous:

Sur la page 4:

Ensuite, sautez à la page 5.

Glissez et déplacez des Button sur les positions sur l'écran de conception comme indiqué ci-dessous:

Lorsque vous cliquez sur CANCEL sur la page 5, le site web irai à la page 4.

Les réglages des propriétés pour le bouton CANCEL:

• Button Name: CANCEL
• Label: Cancel
• Action: Redirect to Page in this Application

• DELETE_IMMEDIATELY

• Button Name: DELETE_IMMEDIATELY
• Label: Delete (Immediately)
• Action: Submit Page
• Database Action: SQL DELETE Action

• Condition Type: Item not null
• Condition Item: P5_DEPTNO

• DELETE_CONFIRM

• Button Name: DELETE_CONFIRM
• Label: Delete (confirm)
• Action: Redirect to URL
• Target: javascript:apex.confirm('Are you sure?','DELETE_CONFIRM');
• Database Action: SQL DELETE action

• Condition Type: Item is NOT NULL
• Condition Item: P5_DEPTNO

Remarque:

apex.confirm(text, BUTTON_NAME) est une fonction javascript disponible dans APEX, il va afficher une Dialog demande une action de confirmation de l'utilisateur avant d'exécuter l'action de définition sur BUTTON_NAME.

Ce Button va afficher sur la page web si P5_DEPTNO n'est pas null.

Vous pouvez également définir une variable javascript et l'utiliser dans l'ensemble de la page web.

// 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,'DELETE_CONFIRM');

• SAVE_EDIT

• Button Name: SAVE_EDIT
• Label: Save (edit)
• Action: Submit Page
• Database Action: SQL UPDATE action

• Condition Type: Item is NOT NULL
• Condition Item: P5_DEPTNO

• SAVE_CREATE

• Button Name: SAVE_CREATE
• Label: Save (create)
• Action: Submit Page
• Database Action: SQL INSERT action
• Condition

  • Type: Item is NULL
  • Item: P5_DEPTNO

• Process

• Get PK: Vérifier le champ P5_DEPTNO est attribué de la valeur ou pas, si non, nous allons attribuer la valeur pour ce champ à partir de DEPT_SEQ (Utiliser au cas de l'Insert).
• Process Row of Dept: Exécuter une action (Insert, Update ou Delete).
• Reset Page: Supprimer des status.

Créer un nouveau Process nommé "Get PK", et saisir des valeurs de l'attribut:

• Name: Get PK
• Type: PL/SQL Code
• PL/SQL Code:

begin
    if :P5_DEPTNO is null then
        select DEPT_SEQ.nextval
          into :P5_DEPTNO
          from dual;
    end if;
end;

Ensuite, vous créez un Process nommé "Process Row of DEPT" avec des attributs:

• Name: Process Row of DEPT
• Type: Automatic Row Processing (DML)
• Table Name: DEPT
• Primary Key Column: DEPTNO
• Primary Key Item: P5_DEPTNO
• Support Operations:

  • Insert
  • Update
  • Delete

Puis, vous créez un Process baptisé "Reset Page" et attribuez la configuration pour ce processus "Utilisé uniquement pour supprimer l'enregistrement".
Les conditions pour lesquelles ce Process est exécuté est que le request comprend le mot "DELETE", cela signifique qu'il sera exécuté lorsque vous cliquez sur le bouton DELETE_IMMEDIATELY ou DELETE_CONFIRM.

Après que le Process est exécuté (Insert, update, delete) sur la page 5, pour retourner à la page 4, vous avez besoin un processus dans "After Processing".

Maintenant, vous pouvez SAVE les changements de la conception de l'écran et tester l'application:

• Le Tutoriel de Oracle APEX Tabular Form