diff --git a/forms-to-apex/1-analyze-sample-forms/analyze.md b/forms-to-apex/1-analyze-sample-forms/analyze.md new file mode 100644 index 000000000..705e72100 --- /dev/null +++ b/forms-to-apex/1-analyze-sample-forms/analyze.md @@ -0,0 +1,135 @@ +# Analyze the Sample Forms [Study] + +## Introduction + +This Lab analyses your current Forms environment and identifies the important business logic. The first part of the Lab provides an overview guide on understanding forms modules and how they compare to APEX modules. The second part provides the sample forms used in this live lab. + +*Note: This Lab assumes you have an Oracle Forms setup in your environment.* + +Estimated Time: 5 Minutes + +### Objectives + +In this lab, you: + +- Understand the current business logic in Oracle Forms and how to map it to Oracle APEX components. + +## Task 1: Analyze Forms Business Logic + +To modernize from Oracle Forms to APEX, you must understand the current business logic of your forms and where they are implemented. This is key for deciding how to adapt them to the APEX environment. The rule of thumb is always to push as much business logic as possible into the Oracle Database. + +For example, the business logic in Oracle Forms resides in the triggers and program units. You can incorporate this logic into Oracle APEX as SQL or PL/SQL code that invokes database packages, procedures, or functions. The same applies to database objects, which do not need alteration when transitioning from Forms to APEX. + +However, in Oracle Forms, business logic is also intertwined with user interface items such as go\_item, set\_item\_property, etc. In this case, separating and pushing logic to the database is impossible. In some cases, pushing the business logic of the triggers and program units into the database might be challenging. + +Analyze and map the logic to the appropriate APEX component. The APEX environment natively handles multiple events and logic blocks through processes, computations, and validations. Understand how these components work and the customizations you can apply to them. This understanding prevents you from rewriting code and business logic that APEX's components can handle automatically. + +You can add business logic to Forms through the PL/SQL attached libraries, which you can usually call from form modules. When mapping to APEX, add this logic as an application-level process that can be called from any application's pages. Additionally, you may find a plug-in to install that achieves the purpose of your business logic and extends your application's functionality. Plug-ins are available on: + +- [apex.oracle.com](https://apex.oracle.com/en/solutions/apps/) +- [apex.world](https://apex.world/ords/f?p=100:700) + +Understanding how the mappings work on data blocks is also essential. In Forms, you can map data blocks into pages and page regions in APEX. There are different types of data blocks on Forms: + +1. **Single Record Blocks**: +In Forms, you may use a single record block for data queries and modifying returned records. In APEX, you generally map Oracle Forms blocks that are insertable, updatable, and have a primary key to an interactive report with a form or an editable Interactive Grid. The edit link on the interactive report allows access to a specific record for updating or deleting, and the interactive report lets you query the entries. An editable interactive grid lets you change several rows simultaneously without navigating to another form page. + +2. **Tabular Forms**: +Tabular Forms blocks in Forms map to an interactive grid in APEX, allowing you to edit each item later as needed (select list, text field, number field, etc.). + +3. **Master Detail Blocks**: +In Forms, master detail blocks highlight relationships between data blocks. In APEX, you can map this through the master detail region. The child region represents the "detail," and the parent region represents the "master," which can be a page region such as an interactive grid. Both regions connect through the foreign key relationship between the columns. You can define several child relationships deep and any number of child relationships wide. + +4. **Non-Database Block**: +Any block in Forms not associated with a database table or view is a non-database block. These blocks usually hold menus, lists, buttons, and other components. In APEX, we define these components based on their type. For example, the page designer defines buttons, while shared components define navigation menus. + +## Task 2: Analyze Sample Forms + +To put the previous guidelines into perspective, let's see how we can analyze the business logic and components of one of our sample forms. For this example, we will use the customer's form. + +[Download the Sample Forms](https://c4u04.objectstorage.us-ashburn-1.oci.customer-oci.com/p/EcTjWk2IuZPZeNnD_fYMcgUhdNDIDA6rt9gaFj_WZMiL7VvxPBNMY60837hu5hga/n/c4u04/b/livelabsfiles/o/labfiles/sample_forms.zip) + +We start by reviewing the existing components in the form to analyze which can be migrated to APEX, which will be mapped to APEX components, and which will be removed or rewritten. + +1. **Data Blocks**: Five data blocks, including **S\_CUSTOMER1** and **S\_CUSTOMER**, are associated with the **S\_CUSTOMER** table. The **S\_CUSTOMER** block is editable and allows CRUD operations, so you can map it into the Form item in APEX to enable the same operations. However, the **S\_CUSTOMER1** block isn't editable, so you can't handle it the same way. + + The remaining three blocks **(CONTROL, NAV\_CONTROL, NAVIGATOR)** are non-database blocks that handle navigation in Forms and control the tree region, which isn't applicable in APEX. + + ![Blocks](images/data-blocks.png " ") + +2. **Triggers**: The Customer's form contains multiple triggers, but we are now mainly focused on the triggers associated with the S\_CUSTOMER block. + + The first trigger is **POST\_QUERY**. This trigger isn't translatable into APEX, as APEX automatically incorporates the trigger logic in the form's creation process. This is where the form items are initialized. Initialization options include initializing the form region items or retrieving data from the region source using the primary key value(s). + + The second trigger is **WHEN-MOUSE-DOUBLECLICK**. This trigger executes the procedure EDIT\_TEXTITEM, which invokes a pop-up window editor for the COMMENTS column. When mapping to APEX, we can ignore this trigger since APEX will automatically initialize this COMMENTS column in the form. + +3. **LOVs**: There is only one list of values created which is **SALES\_REP\_LOV** executing the above SQL statement. + + ![LOVs](images/lovs1.png " ") + + ![LOVs SQL Query](images/sql-query1.png " ") + + In APEX, the LOV is created automatically with the form's creation. However, it may not display the intended values as in the SQL query. + + To change this in **Oracle APEX**: + + - Navigate to **App Builder** and select your application. + + - Click **Shared Components**. + + - Under **Other Components**, click **List of Values**. + + - Click the list of values and update the name and SQL Query. + + *Note: Remember that you can define additional display columns for item types that support multiple display columns.* + + ![LOVs SQL Query](images/sales-rep-lovs1.png " ") + +4. **Alerts**: We have two alerts in the customer's form. The first alert, **DELETE\_ALERT**, is automatically created when the form is created in APEX, and you can customize the displayed message: + + To customize the display message in Oracle APEX, follow the following steps: + + - Navigate to **App Builder** and select your application. + + - Click **Shared Components**. + + - Under **Other Components**, click **Shortcuts**. + + - Click **Create**. + + - Create shortcut **From Scratch**. + + - Click **Next**. + + - For Name, enter **DELETE\_ALERT**. + + - For Type, select **Text with JavaScript Escaped Single Quotes**. + + - For a shortcut, enter the original message. + + - Click **Create**. + + You have created the message and need to update the shortcut in the APEX Form. + + - Go to the **Customers** form page. + + - In the left pane, click the page name. + + - Navigate to property editor and update **Function and Global Variable Declaration** to var htmldb\_delete\_message='"DELETE\_ALERT"'; + + The second, **CONFIRM\_REVERT**, is handled natively by APEX through the warn on unsaved changes property, which can warn users when navigating away from the page with unsaved changes. + + ![Alerts](images/alerts1.png " ") + +5. **Program Units**: The customer form contains seven program units. However, we cannot map them in our APEX app because either APEX handles them natively during form creation or they are not applicable. + + ![Program Units](images/program-units1.png " ") + +## Summary + +This Lab provides a comprehensive approach to understanding and migrating Oracle Forms components to Oracle APEX, ensuring a smooth modernization process by leveraging APEX's native capabilities and customization options. + +## Acknowledgements + +- **Author** - Monica Godoy, Senior Principal Product Manager ; Ankita Beri, Product Manager; Paolo Paolucci, Data Development Specialist; Victor Mendo, Data Development Specialist +- **Last Updated By/Date** - Ankita Beri, Product Manager, July 2024 diff --git a/forms-to-apex/1-analyze-sample-forms/images/alerts.png b/forms-to-apex/1-analyze-sample-forms/images/alerts.png new file mode 100644 index 000000000..f262207a7 Binary files /dev/null and b/forms-to-apex/1-analyze-sample-forms/images/alerts.png differ diff --git a/forms-to-apex/1-analyze-sample-forms/images/alerts1.png b/forms-to-apex/1-analyze-sample-forms/images/alerts1.png new file mode 100644 index 000000000..4242271d0 Binary files /dev/null and b/forms-to-apex/1-analyze-sample-forms/images/alerts1.png differ diff --git a/forms-to-apex/1-analyze-sample-forms/images/data-blocks.png b/forms-to-apex/1-analyze-sample-forms/images/data-blocks.png new file mode 100644 index 000000000..22f27b38a Binary files /dev/null and b/forms-to-apex/1-analyze-sample-forms/images/data-blocks.png differ diff --git a/forms-to-apex/1-analyze-sample-forms/images/lovs.png b/forms-to-apex/1-analyze-sample-forms/images/lovs.png new file mode 100644 index 000000000..2f75ced3b Binary files /dev/null and b/forms-to-apex/1-analyze-sample-forms/images/lovs.png differ diff --git a/forms-to-apex/1-analyze-sample-forms/images/lovs1.png b/forms-to-apex/1-analyze-sample-forms/images/lovs1.png new file mode 100644 index 000000000..7db365dec Binary files /dev/null and b/forms-to-apex/1-analyze-sample-forms/images/lovs1.png differ diff --git a/forms-to-apex/1-analyze-sample-forms/images/program-units.png b/forms-to-apex/1-analyze-sample-forms/images/program-units.png new file mode 100644 index 000000000..9b019b495 Binary files /dev/null and b/forms-to-apex/1-analyze-sample-forms/images/program-units.png differ diff --git a/forms-to-apex/1-analyze-sample-forms/images/program-units1.png b/forms-to-apex/1-analyze-sample-forms/images/program-units1.png new file mode 100644 index 000000000..01f0ae867 Binary files /dev/null and b/forms-to-apex/1-analyze-sample-forms/images/program-units1.png differ diff --git a/forms-to-apex/1-analyze-sample-forms/images/sales-rep-lovs.jpg b/forms-to-apex/1-analyze-sample-forms/images/sales-rep-lovs.jpg new file mode 100644 index 000000000..70ce9917a Binary files /dev/null and b/forms-to-apex/1-analyze-sample-forms/images/sales-rep-lovs.jpg differ diff --git a/forms-to-apex/1-analyze-sample-forms/images/sales-rep-lovs1.png b/forms-to-apex/1-analyze-sample-forms/images/sales-rep-lovs1.png new file mode 100644 index 000000000..1a079396e Binary files /dev/null and b/forms-to-apex/1-analyze-sample-forms/images/sales-rep-lovs1.png differ diff --git a/forms-to-apex/1-analyze-sample-forms/images/sql-query.png b/forms-to-apex/1-analyze-sample-forms/images/sql-query.png new file mode 100644 index 000000000..7ebb95a3d Binary files /dev/null and b/forms-to-apex/1-analyze-sample-forms/images/sql-query.png differ diff --git a/forms-to-apex/1-analyze-sample-forms/images/sql-query1.png b/forms-to-apex/1-analyze-sample-forms/images/sql-query1.png new file mode 100644 index 000000000..466259457 Binary files /dev/null and b/forms-to-apex/1-analyze-sample-forms/images/sql-query1.png differ diff --git a/forms-to-apex/2-mapping-forms-to-apex/2-mapping-forms-to-apex.md b/forms-to-apex/2-mapping-forms-to-apex/2-mapping-forms-to-apex.md new file mode 100644 index 000000000..3ef45ec3f --- /dev/null +++ b/forms-to-apex/2-mapping-forms-to-apex/2-mapping-forms-to-apex.md @@ -0,0 +1,104 @@ +# Mapping Oracle Forms components to APEX [Study] + +## Introduction + +This lab focuses on understanding how to map Oracle Forms components to the most appropriate APEX components to achieve similar functionality. The lab provides guidelines for comparing Oracle Forms modules with those in APEX, noting that mapping may not always be a direct 1:1 relation. + +Estimated Time: 5 Minutes + +### Objectives + +In this lab, you: + +- Understand how to map Oracle Forms components to Oracle APEX components effectively. + +## Task 1: Examine Form's Component + +There are three main approaches to take when mapping modules from Forms to APEX: + +- Discard Forms component/item. +- Move the component's logic into the database. +- Recreate components as an APEX item. + +In the following sections, we will examine each of Form's components to determine how they best map into APEX. + +1. **Alerts**: +You can store an alert message as a text message in shared components in an APEX application. Text messages allow you to build translatable text strings with substitution variables that PL/SQL packages, procedures, and functions can call. + + You can also map alerts into [Dynamic Actions](https://docs.oracle.com/en/database/oracle/apex/24.1/htmdb/managing-dynamic-actions.html#GUID-7E564715-E963-44AA-B620-5FFB5EFA62EE), which execute to display an alert dialog and message when an event occurs. + + Another native approach for initiating alerts is to enable the [Confirmation option on buttons](https://docs.oracle.com/en/database/oracle/apex/24.1/htmdb/creating-buttons.html#GUID-F6DA76D1-2020-4930-8D26-12D0A3497C8E). + + ![Alerts](images/alerts.png " ") + +2. **Blocks**: +Blocks will usually correspond to a region type in APEX. As discussed in Lab 1, blocks are either associated with a database object or not. The block type and the data source type determine which [region type](https://docs.oracle.com/en/database/oracle/apex/24.1/aeacc/regions.html) we map to in APEX. For example, if in Forms, we have a report based on a view, this can be mapped to an interactive report region with data source view. + + ![Blocks](images/blocks1.png " ") + + ![Blocks](images/blocks2.png " ") + +3. **Canvases**: +In Oracle Forms, the canvas is where the graphical user interface (GUI) or background of the Form is drawn. In Oracle APEX, the engine constructs the appearance of each page in an application using templates. [Templates](https://apex.oracle.com/pls/apex/r/apex_pm/ut12/templates) define how pages, page controls, and page components are displayed. +The mapping also involves identifying the [page type](https://docs.oracle.com/en/database/oracle/apex/24.1/htmdb/managing-pages-in-an-application.html), which defines the page's overall functionality and appearance. + + ![Canvases](images/canvases.png " ") + +4. **Coordinates**: +Depending on the coordinate system used in a Forms application, coordinates can be expressed in actual units such as inches, centimetres, and pixels. APEX has built-in [responsiveness](https://docs.oracle.com/en/database/oracle/apex/24.1/htmdb/understanding-the-universal-theme.html) that adjusts based on screen size. Page items and regions are adjusted in size and positioning depending on the screen to render responsively. Hence, APEX doesn't support the coordinates system as it is based on a grid layout that determines how elements are on a page. + +5. **Editors**: +In Forms, editors provide standard editing features, including search and replace and cut, copy, and paste for text items. These can be mapped to the rich text editor page item. + + ![Editors](images/editors.png " ") + +6. **Events**: +Events specify specific actions to occur based on an event that occurred in Forms. In APEX, we can define this behavior using dynamic actions and events. Dynamic actions events allow us to specify client-side actions based on events. + + ![Events](images/events.png " ") + +7. **List of Values**: +The values in Forms can be directly mapped to the [List of Values](https://docs.oracle.com/en/database/oracle/apex/24.1/htmdb/about-lists-of-values.html) in APEX. The values can be defined statically or dynamically from the database. Using SQL queries, we can specify the display and return values of list items. These lists can be reused across the entire application. + + ![List of Values](images/lovs.png " ") + +8. **Object Groups**: +In Forms, object groups are used to share components between multiple forms. These objects are collections of controls, including blocks, canvases, alerts, etc). In APEX, these are mapped to [Shared Components](https://docs.oracle.com/en/database/oracle/apex/24.1/htmdb/shared-components-page.html). + + ![Object Groups](images/object-groups.png " ") + +9. **Parameters**: +A parameter is a variable whose value can be set at runtime. Parameters are beneficial for modifying SELECT statements and setting PL/SQL variables at runtime. In APEX, this can be mapped to the [SET_PARAMETER](https://docs.oracle.com/en/database/oracle/apex/24.1/aeapi/SET_PARAMETER-Procedure.html) procedure in the APEX\_INSTANCE\_ADMIN package, which provides utilities for managing an Oracle APEX runtime environment. + +10. **Program Units**: +As discussed in Lab 1, program units implement business logic in Forms, which can be incorporated into APEX as a PL/SQL package, [page process, computation, or validation](https://docs.oracle.com/en/database/oracle/apex/24.1/htmdb/managing-computations-validations-and-processes.html). + +11. **Property Classes**: +In Forms, a property class is a named object that contains a list of properties and their settings. An object based on a property class can inherit the settings of any property in that class. Property classes are not used within the generation of APEX applications. However, the concept is mapped to how a [theme](https://docs.oracle.com/en/database/oracle/apex/24.1/htmdb/about-themes.html#GUID-DA2773A1-4291-4C1F-B2DD-C3AC822BCCF0) is defined as a named collection of templates used to create the user interface of an application. + + ![Property Classes](images/user-interface.png " ") + +12. **Record Groups**: +In Forms, record groups to define the query for a list of values. As mentioned in the "List of Values" mapping, this is achieved in APEX by mapping it to a dynamic LOV and defining the SQL query for the values. + + ![Record Groups](images/record-groups.png " ") + +13. **Triggers**: +In Forms, a trigger is an event handler written in PL/SQL to augment the default processing behavior. As discussed in Lab 1, the trigger logic can be incorporated into APEX as a computation, validation, or PL/SQL process after creating the initial application to map the business logic. + +14. **Visual Attributes**: +Visual attributes are the font, color, and pattern properties you can set for form and menu objects appearing in the Forms application's interface. You can style your applications using the default cascading style sheets (CSS) installed with APEX or by uploading your own CSS files. + + ![Visual Attributes](images/visual-attributes.png " ") + +15. **Windows**: +The window in Forms is the container for all visual objects that comprise the application, including canvases. Windows maps to a page in APEX since the page holds all of the visual objects for an application. + +## Summary + +This lab provides comprehensive guidelines for mapping various Oracle Forms components to APEX, ensuring functionality is retained or improved during modernization. + +## Acknowledgements + +- **Author** - Monica Godoy, Senior Principal Product Manager ; Ankita Beri, Product Manager; Paolo Paolucci, Data Development Specialist; Victor Mendo, Data Development Specialist +- **Last Updated By/Date** - Ankita Beri, Product Manager, July 2024 diff --git a/forms-to-apex/2-mapping-forms-to-apex/images/alerts.png b/forms-to-apex/2-mapping-forms-to-apex/images/alerts.png new file mode 100644 index 000000000..12cc85715 Binary files /dev/null and b/forms-to-apex/2-mapping-forms-to-apex/images/alerts.png differ diff --git a/forms-to-apex/2-mapping-forms-to-apex/images/blocks1.png b/forms-to-apex/2-mapping-forms-to-apex/images/blocks1.png new file mode 100644 index 000000000..2a644e0c0 Binary files /dev/null and b/forms-to-apex/2-mapping-forms-to-apex/images/blocks1.png differ diff --git a/forms-to-apex/2-mapping-forms-to-apex/images/blocks2.png b/forms-to-apex/2-mapping-forms-to-apex/images/blocks2.png new file mode 100644 index 000000000..3b5587302 Binary files /dev/null and b/forms-to-apex/2-mapping-forms-to-apex/images/blocks2.png differ diff --git a/forms-to-apex/2-mapping-forms-to-apex/images/canvases.png b/forms-to-apex/2-mapping-forms-to-apex/images/canvases.png new file mode 100644 index 000000000..381c1efd9 Binary files /dev/null and b/forms-to-apex/2-mapping-forms-to-apex/images/canvases.png differ diff --git a/forms-to-apex/2-mapping-forms-to-apex/images/editors.png b/forms-to-apex/2-mapping-forms-to-apex/images/editors.png new file mode 100644 index 000000000..493e9a6a8 Binary files /dev/null and b/forms-to-apex/2-mapping-forms-to-apex/images/editors.png differ diff --git a/forms-to-apex/2-mapping-forms-to-apex/images/events.png b/forms-to-apex/2-mapping-forms-to-apex/images/events.png new file mode 100644 index 000000000..e2b492c77 Binary files /dev/null and b/forms-to-apex/2-mapping-forms-to-apex/images/events.png differ diff --git a/forms-to-apex/2-mapping-forms-to-apex/images/lovs.png b/forms-to-apex/2-mapping-forms-to-apex/images/lovs.png new file mode 100644 index 000000000..288fa9e76 Binary files /dev/null and b/forms-to-apex/2-mapping-forms-to-apex/images/lovs.png differ diff --git a/forms-to-apex/2-mapping-forms-to-apex/images/object-groups.png b/forms-to-apex/2-mapping-forms-to-apex/images/object-groups.png new file mode 100644 index 000000000..9dda9db90 Binary files /dev/null and b/forms-to-apex/2-mapping-forms-to-apex/images/object-groups.png differ diff --git a/forms-to-apex/2-mapping-forms-to-apex/images/record-groups.png b/forms-to-apex/2-mapping-forms-to-apex/images/record-groups.png new file mode 100644 index 000000000..ec99294aa Binary files /dev/null and b/forms-to-apex/2-mapping-forms-to-apex/images/record-groups.png differ diff --git a/forms-to-apex/2-mapping-forms-to-apex/images/user-interface.png b/forms-to-apex/2-mapping-forms-to-apex/images/user-interface.png new file mode 100644 index 000000000..6d1ea67a0 Binary files /dev/null and b/forms-to-apex/2-mapping-forms-to-apex/images/user-interface.png differ diff --git a/forms-to-apex/2-mapping-forms-to-apex/images/visual-attributes.png b/forms-to-apex/2-mapping-forms-to-apex/images/visual-attributes.png new file mode 100644 index 000000000..65af0ef1f Binary files /dev/null and b/forms-to-apex/2-mapping-forms-to-apex/images/visual-attributes.png differ diff --git a/forms-to-apex/3-setup-database-objects/3-setup-database-objects.md b/forms-to-apex/3-setup-database-objects/3-setup-database-objects.md new file mode 100644 index 000000000..b81863927 --- /dev/null +++ b/forms-to-apex/3-setup-database-objects/3-setup-database-objects.md @@ -0,0 +1,85 @@ +# Setup the Database objects + +## Introduction + +In this lab, you will create database objects that will be utilized by the APEX environment. The lab involves downloading and running SQL scripts to set up the necessary database schema and populate it with sample data. These steps are foundational for creating an APEX application that leverages these database objects. + +Estimated Time: 5 Minutes + +### Objectives + +- Upload and run the provided SQL scripts in the SQL Workshop to create database schema and insert sample data. + +### Download Sample Scripts + +To create database objects, you need to download the following three files: + +- [labfiles\_forms\_ddl.sql](https://c4u04.objectstorage.us-ashburn-1.oci.customer-oci.com/p/EcTjWk2IuZPZeNnD_fYMcgUhdNDIDA6rt9gaFj_WZMiL7VvxPBNMY60837hu5hga/n/c4u04/b/livelabsfiles/o/labfiles%2Fforms_ddl.sql) as sample DDL script. + +- [labfiles\_forms\_data\_insert.sql](https://c4u04.objectstorage.us-ashburn-1.oci.customer-oci.com/p/EcTjWk2IuZPZeNnD_fYMcgUhdNDIDA6rt9gaFj_WZMiL7VvxPBNMY60837hu5hga/n/c4u04/b/livelabsfiles/o/labfiles%2Fforms_data_insert.sql) as sample data insert script. + +- [labfiles\_pkg\_modernization.sql](https://c4u04.objectstorage.us-ashburn-1.oci.customer-oci.com/p/EcTjWk2IuZPZeNnD_fYMcgUhdNDIDA6rt9gaFj_WZMiL7VvxPBNMY60837hu5hga/n/c4u04/b/livelabsfiles/o/labfiles%2Fpkg_modernization.sql) as a package script. + +## Task 1: Create Database Objects in APEX Workspace + +1. Log in to your APEX Workspace. + +2. On APEX Workspace, click **SQL Workshop** and select **SQL Scripts**. + + ![SQL Scripts](images/sql-scripts.png " ") + +3. Click **Upload**. Now upload the previously downloaded scripts one after the other into the file(**forms\_ddl.sql**, **forms\_data\_insert.sql** and **pkg_modernization.sql**) and click **Upload**. + + ![Upload SQL Scripts](images/upload-script.png " ") + + ![DDL form Conversion](images/forms-ddl.png " ") + + ![Data Insert File](images/forms-data-insert.png " ") + + ![Data Insert File](images/pkg.png " ") + +4. The three scripts are now uploaded to the SQL Scripts workspace page. You need to run them to create and populate the database objects. At the **forms\_ddl.sql** script level, click the run arrow under the label **Run** and then **Run Now** to confirm. + + ![Data Insert File](images/run-forms-ddl.png " ") + + ![Data Insert File](images/run-now-forms-ddl.png " ") + +5. Object creation script output is visible on the page after execution. You can see the total number of statements executed and the total number of errors encountered (see "Statements Processed", "Successful" and "With Errors"). + ![Data Insert File](images/scripts.png " ") + +6. Now click **SQL Scripts** and run the second script to populate the tables, **forms\_data\_insert.sql** under **Run** label and then **Run Now**. + + ![Data Insert File](images/sql-script.png " ") + + ![Data Insert File](images/run-data-insertt.png " ") + + ![Data Insert File](images/run-now-data-insertt.png " ") + +7. You can see the data load results in the execute script output. + + ![Data Insert File](images/successful-data-insert.png " ") + + *Note: Check this population script in advance as probably a proper date format setting (i.e., “MM/DD/YYYY” instead of DD/MM/YYYY”) would be needed to load data without errors.* + +8. Click **SQL Scripts** and run the third script to create a package, **pkg_modernization.sql** under **Run** label and then **Run Now**. + + ![Data Insert File](images/run-pkg.png " ") + + ![Data Insert File](images/run-now-pkg.png " ") + +9. Navigate to **SQL Workshop** and select **Object Browser** to view the tables and the created objects. On the right tab, under **Table**, click **S\_CUSTOMER**. + + ![Data Insert File](images/navigate-object.png " ") + +10. The screenshot below shows the details of the table created, from the table column structure to the populated data, from the triggers to the created constraints. + + ![Data Insert File](images/customer-data.png " ") + +## Summary + +Now that the workspace has been populated with database objects and data content, we can proceed to the next lab creating an APEX application using these database objects. + +## Acknowledgements + +- **Author** - Monica Godoy, Senior Principal Product Manager ; Ankita Beri, Product Manager; Paolo Paolucci, Data Development Specialist; Victor Mendo, Data Development Specialist +- **Last Updated By/Date** - Ankita Beri, Product Manager, July 2024 diff --git a/forms-to-apex/3-setup-database-objects/images/customer-data.png b/forms-to-apex/3-setup-database-objects/images/customer-data.png new file mode 100644 index 000000000..126b99fe0 Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/customer-data.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/data-insert-file.png b/forms-to-apex/3-setup-database-objects/images/data-insert-file.png new file mode 100644 index 000000000..e7da197b8 Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/data-insert-file.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/form-conversion-ddl-file.png b/forms-to-apex/3-setup-database-objects/images/form-conversion-ddl-file.png new file mode 100644 index 000000000..5b4f5f451 Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/form-conversion-ddl-file.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/forms-data-insert.png b/forms-to-apex/3-setup-database-objects/images/forms-data-insert.png new file mode 100644 index 000000000..321ab95d1 Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/forms-data-insert.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/forms-ddl.png b/forms-to-apex/3-setup-database-objects/images/forms-ddl.png new file mode 100644 index 000000000..d7f5e7187 Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/forms-ddl.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/navigate-object.png b/forms-to-apex/3-setup-database-objects/images/navigate-object.png new file mode 100644 index 000000000..8bece18dc Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/navigate-object.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/object-browser.png b/forms-to-apex/3-setup-database-objects/images/object-browser.png new file mode 100644 index 000000000..a7fa913ed Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/object-browser.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/pkg.png b/forms-to-apex/3-setup-database-objects/images/pkg.png new file mode 100644 index 000000000..e92ce0784 Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/pkg.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/run-data-insert.png b/forms-to-apex/3-setup-database-objects/images/run-data-insert.png new file mode 100644 index 000000000..1b1c4345c Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/run-data-insert.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/run-data-insertt.png b/forms-to-apex/3-setup-database-objects/images/run-data-insertt.png new file mode 100644 index 000000000..a46dc35f3 Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/run-data-insertt.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/run-ddl.png b/forms-to-apex/3-setup-database-objects/images/run-ddl.png new file mode 100644 index 000000000..c7b8c6c67 Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/run-ddl.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/run-forms-ddl.png b/forms-to-apex/3-setup-database-objects/images/run-forms-ddl.png new file mode 100644 index 000000000..b5cb5d226 Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/run-forms-ddl.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/run-now-data-insert.png b/forms-to-apex/3-setup-database-objects/images/run-now-data-insert.png new file mode 100644 index 000000000..bce2160be Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/run-now-data-insert.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/run-now-data-insertt.png b/forms-to-apex/3-setup-database-objects/images/run-now-data-insertt.png new file mode 100644 index 000000000..2c4e4c9c6 Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/run-now-data-insertt.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/run-now-ddl.png b/forms-to-apex/3-setup-database-objects/images/run-now-ddl.png new file mode 100644 index 000000000..a68baf51f Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/run-now-ddl.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/run-now-forms-ddl.png b/forms-to-apex/3-setup-database-objects/images/run-now-forms-ddl.png new file mode 100644 index 000000000..81b33a2c5 Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/run-now-forms-ddl.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/run-now-pkg.png b/forms-to-apex/3-setup-database-objects/images/run-now-pkg.png new file mode 100644 index 000000000..bdae4657c Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/run-now-pkg.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/run-pkg.png b/forms-to-apex/3-setup-database-objects/images/run-pkg.png new file mode 100644 index 000000000..1b152e83f Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/run-pkg.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/scripts.png b/forms-to-apex/3-setup-database-objects/images/scripts.png new file mode 100644 index 000000000..277f6848c Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/scripts.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/sql-script.png b/forms-to-apex/3-setup-database-objects/images/sql-script.png new file mode 100644 index 000000000..a4679e9cb Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/sql-script.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/sql-scripts.png b/forms-to-apex/3-setup-database-objects/images/sql-scripts.png new file mode 100644 index 000000000..f43009473 Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/sql-scripts.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/successful-data-insert.png b/forms-to-apex/3-setup-database-objects/images/successful-data-insert.png new file mode 100644 index 000000000..2e67ca2c6 Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/successful-data-insert.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/successful-ddl.png b/forms-to-apex/3-setup-database-objects/images/successful-ddl.png new file mode 100644 index 000000000..1ff304360 Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/successful-ddl.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/upload-data-insert.png b/forms-to-apex/3-setup-database-objects/images/upload-data-insert.png new file mode 100644 index 000000000..60c975128 Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/upload-data-insert.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/upload-package.png b/forms-to-apex/3-setup-database-objects/images/upload-package.png new file mode 100644 index 000000000..529f03eae Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/upload-package.png differ diff --git a/forms-to-apex/3-setup-database-objects/images/upload-script.png b/forms-to-apex/3-setup-database-objects/images/upload-script.png new file mode 100644 index 000000000..79d23be17 Binary files /dev/null and b/forms-to-apex/3-setup-database-objects/images/upload-script.png differ diff --git a/forms-to-apex/4-create-apex-app/4-create-apex-app.md b/forms-to-apex/4-create-apex-app/4-create-apex-app.md new file mode 100644 index 000000000..0f5703121 --- /dev/null +++ b/forms-to-apex/4-create-apex-app/4-create-apex-app.md @@ -0,0 +1,130 @@ +# Create the APEX Application + +## Introduction + +In this lab, you will create an Oracle APEX application using the create application wizard. This process will help you transition from Oracle Forms to APEX by creating a modern web application interface for your database objects. + +Before we begin, let's recap what we have set up so far: + +- An Always-Free Autonomous Database +- An APEX Workspace with the necessary database objects already loaded + +The goal of this lab is to guide you through the steps to create an APEX application with various types of pages such as faceted search, interactive reports and forms. This will showcase the flexibility and power of APEX in building sophisticated web applications with ease. + +By the end of this lab, you will have an APEX application with multiple pages, each demonstrating different features and functionalities, ready to be enhanced further in subsequent labs. + +Estimated Time: 5 Minutes + +### Objectives + +In this lab, you: + +- Create an Oracle APEX application using the create application wizard. +- Add multiple types of pages such as faceted search, interactive reports and forms to the APEX application. +- Manage and enhance application pages. + +## Task 1: Create an Application + +1. First, log in to your APEX workspace. + +2. Click **App Builder**. + + ![App Builder](images/app-builder.png " ") + +3. On **App Builder** page, click **Create a New App**. + + ![Create a New App](images/create-new-app.png " ") + +4. Click **Use Create App Wizard**. + + ![Use Create App Wizard](images/use-create-app-wizard.png " ") + +5. Since you will create a new application, enter the name **Modernization** and leave the app icon and appearance with default values. Click **Add Page**. + + ![Add Page](images/add-page1.png " ") + + *Note: Default App Icon could be different in your environment, for simplicity just accept the default.* + +6. Select **Faceted Search**. + + ![faceted search](images/faceted-search1.png " ") + +7. On **Add Faceted Search Page**, enter/select the following: + + - Page Name: **Customer - Faceted Search** + + - Table: **S\_CUSTOMER** + + - Check the **Include Form** checkbox + + Click **Add Page**. + + ![faceted search](images/add-faceted-search-page1.png " ") + +8. On Create an Application page, click **Add Page** to add another page for customers table (S\_CUSTOMER) and select **Interactive Report**. + + ![interactive report](images/interactive-report.png " ") + +9. On **Add Report Page**, enter/select the following: + + - Page Name: **Customer – Interactive Report** + + - Table or View: **S\_CUSTOMER** + + Click **Add Page**. + + ![interactive report](images/add-report-page1.png " ") + +10. Add a new page for the S_ORD table. Click **Add Page** and select **Faceted Search**. + + ![Faceted Search](images/faceted-search2.png " ") + +11. On **Add Faceted Search Page**, enter/select the following: + + - Page Name: **Orders - Faceted Search** + + - Table: **S\_ORD** + + Click **Add Page**. + + ![Faceted Search](images/add-faceted-search-page21.png " ") + +12. Add a new form for the S_ORD table to manage the orders. Click **Add Page** and select **Form**. + + ![Faceted Search](images/form.png " ") + +13. On **Create Form Page**, enter the following: + + - Page Name: **Orders Form** + + - Table: **S\_ORD** + + Click **Add Page**. + + ![Faceted Search](images/form-page.png " ") + +14. Under **Features**, check **Install Progressive Web App** and click **Create Application**. + + ![create application](images/create-app12.png " ") + +## Task 2: Run the Application + +1. Now let’s run the application from the current page as a developer. Click **Run Application**. + + ![Run application](images/run-application12.png " ") + +2. Enter the credentials. The home page includes a link to the pages created previously. You can edit this page as you need. Click on the hamburger menu on the top to explore all the pages. + + ![application](images/application12.png " ") + + ![application](images/app-form12.png " ") + +## Summary + +You have now created the APEX application with multiple report example scenarios for the Customer, Orders tables. +In the next lab you will undertake Oracle Forms functionalities enhancement steps in APEX. + +## Acknowledgements + +- **Author** - Monica Godoy, Senior Principal Product Manager ; Ankita Beri, Product Manager; Paolo Paolucci, Data Development Specialist; Victor Mendo, Data Development Specialist +- **Last Updated By/Date** - Ankita Beri, Product Manager, July 2024 diff --git a/forms-to-apex/4-create-apex-app/images/add-faceted-search-page.png b/forms-to-apex/4-create-apex-app/images/add-faceted-search-page.png new file mode 100644 index 000000000..63d67bcd3 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/add-faceted-search-page.png differ diff --git a/forms-to-apex/4-create-apex-app/images/add-faceted-search-page1.png b/forms-to-apex/4-create-apex-app/images/add-faceted-search-page1.png new file mode 100644 index 000000000..b0530314d Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/add-faceted-search-page1.png differ diff --git a/forms-to-apex/4-create-apex-app/images/add-faceted-search-page2.png b/forms-to-apex/4-create-apex-app/images/add-faceted-search-page2.png new file mode 100644 index 000000000..d839f5cc6 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/add-faceted-search-page2.png differ diff --git a/forms-to-apex/4-create-apex-app/images/add-faceted-search-page21.png b/forms-to-apex/4-create-apex-app/images/add-faceted-search-page21.png new file mode 100644 index 000000000..b90d23644 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/add-faceted-search-page21.png differ diff --git a/forms-to-apex/4-create-apex-app/images/add-master-detail-page.png b/forms-to-apex/4-create-apex-app/images/add-master-detail-page.png new file mode 100644 index 000000000..7b8f0d354 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/add-master-detail-page.png differ diff --git a/forms-to-apex/4-create-apex-app/images/add-page1.png b/forms-to-apex/4-create-apex-app/images/add-page1.png new file mode 100644 index 000000000..1454bdbec Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/add-page1.png differ diff --git a/forms-to-apex/4-create-apex-app/images/add-report-page.png b/forms-to-apex/4-create-apex-app/images/add-report-page.png new file mode 100644 index 000000000..3fb6490d5 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/add-report-page.png differ diff --git a/forms-to-apex/4-create-apex-app/images/add-report-page1.png b/forms-to-apex/4-create-apex-app/images/add-report-page1.png new file mode 100644 index 000000000..ffaed74dc Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/add-report-page1.png differ diff --git a/forms-to-apex/4-create-apex-app/images/app-builder.png b/forms-to-apex/4-create-apex-app/images/app-builder.png new file mode 100644 index 000000000..a78e8f10b Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/app-builder.png differ diff --git a/forms-to-apex/4-create-apex-app/images/app-form.png b/forms-to-apex/4-create-apex-app/images/app-form.png new file mode 100644 index 000000000..29dbd9a5c Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/app-form.png differ diff --git a/forms-to-apex/4-create-apex-app/images/app-form1.png b/forms-to-apex/4-create-apex-app/images/app-form1.png new file mode 100644 index 000000000..b1c91780f Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/app-form1.png differ diff --git a/forms-to-apex/4-create-apex-app/images/app-form12.png b/forms-to-apex/4-create-apex-app/images/app-form12.png new file mode 100644 index 000000000..402d5485b Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/app-form12.png differ diff --git a/forms-to-apex/4-create-apex-app/images/application.png b/forms-to-apex/4-create-apex-app/images/application.png new file mode 100644 index 000000000..9f48b1e6d Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/application.png differ diff --git a/forms-to-apex/4-create-apex-app/images/application1.png b/forms-to-apex/4-create-apex-app/images/application1.png new file mode 100644 index 000000000..d33529666 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/application1.png differ diff --git a/forms-to-apex/4-create-apex-app/images/application12.png b/forms-to-apex/4-create-apex-app/images/application12.png new file mode 100644 index 000000000..4900ed502 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/application12.png differ diff --git a/forms-to-apex/4-create-apex-app/images/create-app1.png b/forms-to-apex/4-create-apex-app/images/create-app1.png new file mode 100644 index 000000000..b5b48dc39 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/create-app1.png differ diff --git a/forms-to-apex/4-create-apex-app/images/create-app11.png b/forms-to-apex/4-create-apex-app/images/create-app11.png new file mode 100644 index 000000000..bcc10b657 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/create-app11.png differ diff --git a/forms-to-apex/4-create-apex-app/images/create-app12.png b/forms-to-apex/4-create-apex-app/images/create-app12.png new file mode 100644 index 000000000..11b7126bf Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/create-app12.png differ diff --git a/forms-to-apex/4-create-apex-app/images/create-application.png b/forms-to-apex/4-create-apex-app/images/create-application.png new file mode 100644 index 000000000..fc7d6a296 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/create-application.png differ diff --git a/forms-to-apex/4-create-apex-app/images/create-master-detail1.png b/forms-to-apex/4-create-apex-app/images/create-master-detail1.png new file mode 100644 index 000000000..a392ccfdd Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/create-master-detail1.png differ diff --git a/forms-to-apex/4-create-apex-app/images/create-master-detail2.png b/forms-to-apex/4-create-apex-app/images/create-master-detail2.png new file mode 100644 index 000000000..09dac650c Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/create-master-detail2.png differ diff --git a/forms-to-apex/4-create-apex-app/images/create-master-detail3.png b/forms-to-apex/4-create-apex-app/images/create-master-detail3.png new file mode 100644 index 000000000..172c55991 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/create-master-detail3.png differ diff --git a/forms-to-apex/4-create-apex-app/images/create-new-app.png b/forms-to-apex/4-create-apex-app/images/create-new-app.png new file mode 100644 index 000000000..3eafa4ec0 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/create-new-app.png differ diff --git a/forms-to-apex/4-create-apex-app/images/create-page1.png b/forms-to-apex/4-create-apex-app/images/create-page1.png new file mode 100644 index 000000000..8a67ef764 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/create-page1.png differ diff --git a/forms-to-apex/4-create-apex-app/images/create-page2.png b/forms-to-apex/4-create-apex-app/images/create-page2.png new file mode 100644 index 000000000..76bc34486 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/create-page2.png differ diff --git a/forms-to-apex/4-create-apex-app/images/drill-down.png b/forms-to-apex/4-create-apex-app/images/drill-down.png new file mode 100644 index 000000000..03b53809c Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/drill-down.png differ diff --git a/forms-to-apex/4-create-apex-app/images/drill-down1.png b/forms-to-apex/4-create-apex-app/images/drill-down1.png new file mode 100644 index 000000000..9a248ff8f Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/drill-down1.png differ diff --git a/forms-to-apex/4-create-apex-app/images/drill-down2.png b/forms-to-apex/4-create-apex-app/images/drill-down2.png new file mode 100644 index 000000000..99c497de9 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/drill-down2.png differ diff --git a/forms-to-apex/4-create-apex-app/images/drill-down3.png b/forms-to-apex/4-create-apex-app/images/drill-down3.png new file mode 100644 index 000000000..0aa82474d Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/drill-down3.png differ diff --git a/forms-to-apex/4-create-apex-app/images/drill-down4.png b/forms-to-apex/4-create-apex-app/images/drill-down4.png new file mode 100644 index 000000000..68eedd0e3 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/drill-down4.png differ diff --git a/forms-to-apex/4-create-apex-app/images/drill-down5.png b/forms-to-apex/4-create-apex-app/images/drill-down5.png new file mode 100644 index 000000000..0b6c596ac Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/drill-down5.png differ diff --git a/forms-to-apex/4-create-apex-app/images/edit-drill.png b/forms-to-apex/4-create-apex-app/images/edit-drill.png new file mode 100644 index 000000000..a47533fa5 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/edit-drill.png differ diff --git a/forms-to-apex/4-create-apex-app/images/edit-drill1.png b/forms-to-apex/4-create-apex-app/images/edit-drill1.png new file mode 100644 index 000000000..e771cad6e Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/edit-drill1.png differ diff --git a/forms-to-apex/4-create-apex-app/images/faceted-search1.png b/forms-to-apex/4-create-apex-app/images/faceted-search1.png new file mode 100644 index 000000000..1e88fd23e Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/faceted-search1.png differ diff --git a/forms-to-apex/4-create-apex-app/images/faceted-search2.png b/forms-to-apex/4-create-apex-app/images/faceted-search2.png new file mode 100644 index 000000000..99e7a4c4c Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/faceted-search2.png differ diff --git a/forms-to-apex/4-create-apex-app/images/form-page.png b/forms-to-apex/4-create-apex-app/images/form-page.png new file mode 100644 index 000000000..d3d097373 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/form-page.png differ diff --git a/forms-to-apex/4-create-apex-app/images/form.png b/forms-to-apex/4-create-apex-app/images/form.png new file mode 100644 index 000000000..14d1d416e Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/form.png differ diff --git a/forms-to-apex/4-create-apex-app/images/interactive-report.png b/forms-to-apex/4-create-apex-app/images/interactive-report.png new file mode 100644 index 000000000..ce5814cb5 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/interactive-report.png differ diff --git a/forms-to-apex/4-create-apex-app/images/master-detail.png b/forms-to-apex/4-create-apex-app/images/master-detail.png new file mode 100644 index 000000000..055a4e931 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/master-detail.png differ diff --git a/forms-to-apex/4-create-apex-app/images/master-detail1.png b/forms-to-apex/4-create-apex-app/images/master-detail1.png new file mode 100644 index 000000000..b9dd47d03 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/master-detail1.png differ diff --git a/forms-to-apex/4-create-apex-app/images/master-detail5.png b/forms-to-apex/4-create-apex-app/images/master-detail5.png new file mode 100644 index 000000000..44c8a20a0 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/master-detail5.png differ diff --git a/forms-to-apex/4-create-apex-app/images/orders-side.png b/forms-to-apex/4-create-apex-app/images/orders-side.png new file mode 100644 index 000000000..59a11bb07 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/orders-side.png differ diff --git a/forms-to-apex/4-create-apex-app/images/orders-side2.png b/forms-to-apex/4-create-apex-app/images/orders-side2.png new file mode 100644 index 000000000..699ea1bf3 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/orders-side2.png differ diff --git a/forms-to-apex/4-create-apex-app/images/panes.png b/forms-to-apex/4-create-apex-app/images/panes.png new file mode 100644 index 000000000..af23029e2 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/panes.png differ diff --git a/forms-to-apex/4-create-apex-app/images/run-application.png b/forms-to-apex/4-create-apex-app/images/run-application.png new file mode 100644 index 000000000..040de04bf Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/run-application.png differ diff --git a/forms-to-apex/4-create-apex-app/images/run-application1.png b/forms-to-apex/4-create-apex-app/images/run-application1.png new file mode 100644 index 000000000..c0baec664 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/run-application1.png differ diff --git a/forms-to-apex/4-create-apex-app/images/run-application12.png b/forms-to-apex/4-create-apex-app/images/run-application12.png new file mode 100644 index 000000000..c04843678 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/run-application12.png differ diff --git a/forms-to-apex/4-create-apex-app/images/run-drill.png b/forms-to-apex/4-create-apex-app/images/run-drill.png new file mode 100644 index 000000000..f5ac14295 Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/run-drill.png differ diff --git a/forms-to-apex/4-create-apex-app/images/use-create-app-wizard.png b/forms-to-apex/4-create-apex-app/images/use-create-app-wizard.png new file mode 100644 index 000000000..a5880766b Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/use-create-app-wizard.png differ diff --git a/forms-to-apex/4-create-apex-app/images/view-drill.png b/forms-to-apex/4-create-apex-app/images/view-drill.png new file mode 100644 index 000000000..1660b2e1e Binary files /dev/null and b/forms-to-apex/4-create-apex-app/images/view-drill.png differ diff --git a/forms-to-apex/5-configure-list-values/5-configure-list-values.md b/forms-to-apex/5-configure-list-values/5-configure-list-values.md new file mode 100644 index 000000000..e14f0e003 --- /dev/null +++ b/forms-to-apex/5-configure-list-values/5-configure-list-values.md @@ -0,0 +1,170 @@ +# Configure List of Values + +## Introduction + +You will create five lists of values that will be useful in the Faceted Search Page and Orders Page: + +- **S\_CUSTOMER.CREDIT\_RATING**: The table S\_CUSTOMER has a column named CREDIT\_RATING with a check constraint. The column can only contain the following values: EXCELLENT, GOOD, and POOR. Creating a list of values is important to prevent end-users from entering invalid options. + + ![constraint](images/constraint.png " ") + +- **SALES\_REP\_LOV**: A dynamic list of values based on the S_EMP table. + +- **S\_CUSTOMER.NAME**: A dynamic list of values based on the S_CUSTOMER table. This List of Values has already been created. + +- **S\_ORD.PAYMENT\_TYPE**: A static list of values using the following values: CASH, CREDIT, CHECK + +- **S\_PRODUCT.NAME**: A dynamic list of values based on the S_PRODUCT table. + +Estimated Time: 5 Minutes + +### Objectives + +In this lab, you will build the list of values needed to help you accelerate the development process. + +## Task 1: Configure List of Values + +1. To create **List of Values**, click **App Builder** and select your application: **Modernization**. + + ![App Builder](images/app-builder1.png " ") + + ![modernization](images/modernization.png " ") + +2. Click **Shared Components**. + + ![Shared Components](images/shared-comps.png " ") + +3. Under **Other Components**, click **Lists of Values**. + + ![List of Values](images/lov1.png " ") + +4. Click **Create**. + + ![Create List of Values](images/create-lov1.png " ") + +5. Create list of values **From Scratch** and click **Next**. + + ![Create List of Values](images/scratch-lov.png " ") + +6. Under **Name and Type**, enter/select the following: + + - Name: **S\_CUSTOMER.CREDIT\_RATING** + + - Type: **Static**. + + Click **Next**. + + ![Create List of Values](images/credit-rate-lov.png " ") + +7. Enter the following display values and return values: + + | Display Value | Return Value | + |---------------|--------------| + |Excellent | EXCELLENT | + |Good | GOOD | + | Poor | POOR | + {: title="List of Values"} + + Click **Create List of Values**. + + ![Create List of Values](images/values-lov.png " ") + +8. Click **Create** to create another list of values. + + ![Create List of Values](images/create-sales-rep-lov.png " ") + +9. Create list of values **From Scratch** and click **Next**. + + ![Create List of Values](images/lov-scratch-next.png " ") + +10. For **Name**: enter **SALES\_REP\_LOV** and click **Next**. + + ![Create List of Values](images/sales-rep-lov.png " ") + +11. Under **List of Values Source**, enter/select the following: + + - Source Type: **SQL Query** + + - Enter a SQL SELECT statement: Copy and Paste the below query into the code editor: + + ``` + + select S_EMP.ID as ID, + S_EMP.FIRST_NAME ||' '|| S_EMP.LAST_NAME as FULL_NAME, + S_EMP.FIRST_NAME , + S_EMP.LAST_NAME + from S_EMP S_EMP + where title = 'Sales Representative' + + ``` + Click **Next**. + + ![Create List of Values](images/sql-query1.png " ") + +12. Click **Create**. + + ![Create List of Values](images/create-sales-lov.png " ") + +13. Click **Create** to create another list of values. + + ![Create List of Values](images/create-lov-pay1.png " ") + +14. Create list of values **From Scratch** and click **Next**. + + ![Create List of Values](images/lov-scratch-next.png " ") + +15. Enter/select the following and click **Next**. + + - Name: **S\_ORD.PAYMENT\_TYPE** + + - Type: **Static** + + ![Create List of Values](images/name-static-next.png " ") + +16. Enter the following **Display Value** and **Return Value** and click **Create List of Values**. + + | Display Value | Return Value | + |---------------|--------------| + |CASH | CASH | + |CREDIT | CREDIT | + |CHECK | CHECK | + {: title="List of Values"} + + ![Create List of Values](images/display-return-create.png " ") + +17. Click **Create** to create another list of values. + + ![Create List of Values](images/lov-product1.png " ") + +18. Create list of values from scratch and click **Next**. + + ![Create List of Values](images/lov-scratch-next.png " ") + +19. Enter/select the following and click **Next**. + + - Name: **S\_PRODUCT.NAME** + + - Type: **Dynamic** + + ![Create List of Values](images/name-dynamic-next.png " ") + +20. Under list of values Source, enter the following and click **Next**. + + - Source Type: Table + + - Table / View Name: **S\_PRODUCT** + + ![Create List of Values](images/product-next.png " ") + +21. Click **Create**. + + ![Create List of Values](images/create-product-lov.png " ") + +## Summary + +In this lab, you learned how to create useful list of values that you will use in the next labs. + +## Acknowledgements + +- **Author** - Monica Godoy, Senior Principal Product Manager ; Ankita Beri, Product Manager; Paolo Paolucci, Data Development Specialist; Victor Mendo, Data Development Specialist +- **Last Updated By/Date** - Ankita Beri, Product Manager, July 2024 diff --git a/forms-to-apex/5-configure-list-values/images/actions.png b/forms-to-apex/5-configure-list-values/images/actions.png new file mode 100644 index 000000000..961204444 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/actions.png differ diff --git a/forms-to-apex/5-configure-list-values/images/actions1.png b/forms-to-apex/5-configure-list-values/images/actions1.png new file mode 100644 index 000000000..fa7cb5e55 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/actions1.png differ diff --git a/forms-to-apex/5-configure-list-values/images/app-builder1.png b/forms-to-apex/5-configure-list-values/images/app-builder1.png new file mode 100644 index 000000000..be06e663e Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/app-builder1.png differ diff --git a/forms-to-apex/5-configure-list-values/images/as-named-report.png b/forms-to-apex/5-configure-list-values/images/as-named-report.png new file mode 100644 index 000000000..bf7e8b7c8 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/as-named-report.png differ diff --git a/forms-to-apex/5-configure-list-values/images/as-named-report1.png b/forms-to-apex/5-configure-list-values/images/as-named-report1.png new file mode 100644 index 000000000..258e080a8 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/as-named-report1.png differ diff --git a/forms-to-apex/5-configure-list-values/images/authentication-scheme.png b/forms-to-apex/5-configure-list-values/images/authentication-scheme.png new file mode 100644 index 000000000..d0c0c45d0 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/authentication-scheme.png differ diff --git a/forms-to-apex/5-configure-list-values/images/click-no-authen.png b/forms-to-apex/5-configure-list-values/images/click-no-authen.png new file mode 100644 index 000000000..b77c124b5 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/click-no-authen.png differ diff --git a/forms-to-apex/5-configure-list-values/images/column-mapp.png b/forms-to-apex/5-configure-list-values/images/column-mapp.png new file mode 100644 index 000000000..5f735aabf Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/column-mapp.png differ diff --git a/forms-to-apex/5-configure-list-values/images/constraint.png b/forms-to-apex/5-configure-list-values/images/constraint.png new file mode 100644 index 000000000..060d7c73b Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/constraint.png differ diff --git a/forms-to-apex/5-configure-list-values/images/control-break-name.png b/forms-to-apex/5-configure-list-values/images/control-break-name.png new file mode 100644 index 000000000..bb0d4fb9c Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/control-break-name.png differ diff --git a/forms-to-apex/5-configure-list-values/images/control-break-name1.png b/forms-to-apex/5-configure-list-values/images/control-break-name1.png new file mode 100644 index 000000000..7a33b0518 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/control-break-name1.png differ diff --git a/forms-to-apex/5-configure-list-values/images/control-break.png b/forms-to-apex/5-configure-list-values/images/control-break.png new file mode 100644 index 000000000..ff8d89982 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/control-break.png differ diff --git a/forms-to-apex/5-configure-list-values/images/control-break1.png b/forms-to-apex/5-configure-list-values/images/control-break1.png new file mode 100644 index 000000000..b25f639ab Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/control-break1.png differ diff --git a/forms-to-apex/5-configure-list-values/images/create-authen.png b/forms-to-apex/5-configure-list-values/images/create-authen.png new file mode 100644 index 000000000..874c96eeb Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/create-authen.png differ diff --git a/forms-to-apex/5-configure-list-values/images/create-entry.png b/forms-to-apex/5-configure-list-values/images/create-entry.png new file mode 100644 index 000000000..b5205bdb6 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/create-entry.png differ diff --git a/forms-to-apex/5-configure-list-values/images/create-facets.png b/forms-to-apex/5-configure-list-values/images/create-facets.png new file mode 100644 index 000000000..68cdf9ce9 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/create-facets.png differ diff --git a/forms-to-apex/5-configure-list-values/images/create-facets1.png b/forms-to-apex/5-configure-list-values/images/create-facets1.png new file mode 100644 index 000000000..9fe582bee Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/create-facets1.png differ diff --git a/forms-to-apex/5-configure-list-values/images/create-lov-pay.png b/forms-to-apex/5-configure-list-values/images/create-lov-pay.png new file mode 100644 index 000000000..bb973d64b Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/create-lov-pay.png differ diff --git a/forms-to-apex/5-configure-list-values/images/create-lov-pay1.png b/forms-to-apex/5-configure-list-values/images/create-lov-pay1.png new file mode 100644 index 000000000..9322e42a4 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/create-lov-pay1.png differ diff --git a/forms-to-apex/5-configure-list-values/images/create-lov.png b/forms-to-apex/5-configure-list-values/images/create-lov.png new file mode 100644 index 000000000..9841a370d Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/create-lov.png differ diff --git a/forms-to-apex/5-configure-list-values/images/create-lov1.png b/forms-to-apex/5-configure-list-values/images/create-lov1.png new file mode 100644 index 000000000..2a2c1d9c7 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/create-lov1.png differ diff --git a/forms-to-apex/5-configure-list-values/images/create-product-lov.png b/forms-to-apex/5-configure-list-values/images/create-product-lov.png new file mode 100644 index 000000000..ca8f6acfa Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/create-product-lov.png differ diff --git a/forms-to-apex/5-configure-list-values/images/create-sales-lov.png b/forms-to-apex/5-configure-list-values/images/create-sales-lov.png new file mode 100644 index 000000000..6be0250bd Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/create-sales-lov.png differ diff --git a/forms-to-apex/5-configure-list-values/images/create-sales-rep-lov.png b/forms-to-apex/5-configure-list-values/images/create-sales-rep-lov.png new file mode 100644 index 000000000..25eac8327 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/create-sales-rep-lov.png differ diff --git a/forms-to-apex/5-configure-list-values/images/credit-rate-lov.png b/forms-to-apex/5-configure-list-values/images/credit-rate-lov.png new file mode 100644 index 000000000..e23fa000c Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/credit-rate-lov.png differ diff --git a/forms-to-apex/5-configure-list-values/images/credit-rate-radio.png b/forms-to-apex/5-configure-list-values/images/credit-rate-radio.png new file mode 100644 index 000000000..dc452efcd Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/credit-rate-radio.png differ diff --git a/forms-to-apex/5-configure-list-values/images/credit-rating.png b/forms-to-apex/5-configure-list-values/images/credit-rating.png new file mode 100644 index 000000000..da2b0d9e7 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/credit-rating.png differ diff --git a/forms-to-apex/5-configure-list-values/images/credit-rating1.png b/forms-to-apex/5-configure-list-values/images/credit-rating1.png new file mode 100644 index 000000000..b658b54f0 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/credit-rating1.png differ diff --git a/forms-to-apex/5-configure-list-values/images/cust-interactive-report.png b/forms-to-apex/5-configure-list-values/images/cust-interactive-report.png new file mode 100644 index 000000000..0500bcdd6 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/cust-interactive-report.png differ diff --git a/forms-to-apex/5-configure-list-values/images/cust-interactive-report1.png b/forms-to-apex/5-configure-list-values/images/cust-interactive-report1.png new file mode 100644 index 000000000..c02a5f4d1 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/cust-interactive-report1.png differ diff --git a/forms-to-apex/5-configure-list-values/images/cust-nav.png b/forms-to-apex/5-configure-list-values/images/cust-nav.png new file mode 100644 index 000000000..395772f6a Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/cust-nav.png differ diff --git a/forms-to-apex/5-configure-list-values/images/customers-nav.png b/forms-to-apex/5-configure-list-values/images/customers-nav.png new file mode 100644 index 000000000..e0f92349f Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/customers-nav.png differ diff --git a/forms-to-apex/5-configure-list-values/images/display-return-create.png b/forms-to-apex/5-configure-list-values/images/display-return-create.png new file mode 100644 index 000000000..6a23dc8cc Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/display-return-create.png differ diff --git a/forms-to-apex/5-configure-list-values/images/do-not-display.png b/forms-to-apex/5-configure-list-values/images/do-not-display.png new file mode 100644 index 000000000..ccefacb93 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/do-not-display.png differ diff --git a/forms-to-apex/5-configure-list-values/images/do-not-display1.png b/forms-to-apex/5-configure-list-values/images/do-not-display1.png new file mode 100644 index 000000000..2d97f6d4a Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/do-not-display1.png differ diff --git a/forms-to-apex/5-configure-list-values/images/donot-display.png b/forms-to-apex/5-configure-list-values/images/donot-display.png new file mode 100644 index 000000000..fc981c51c Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/donot-display.png differ diff --git a/forms-to-apex/5-configure-list-values/images/login.png b/forms-to-apex/5-configure-list-values/images/login.png new file mode 100644 index 000000000..21d678a34 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/login.png differ diff --git a/forms-to-apex/5-configure-list-values/images/lov-product.png b/forms-to-apex/5-configure-list-values/images/lov-product.png new file mode 100644 index 000000000..a01cb1a6e Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/lov-product.png differ diff --git a/forms-to-apex/5-configure-list-values/images/lov-product1.png b/forms-to-apex/5-configure-list-values/images/lov-product1.png new file mode 100644 index 000000000..b5d0c3d4b Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/lov-product1.png differ diff --git a/forms-to-apex/5-configure-list-values/images/lov-scratch-next.png b/forms-to-apex/5-configure-list-values/images/lov-scratch-next.png new file mode 100644 index 000000000..ab14503b6 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/lov-scratch-next.png differ diff --git a/forms-to-apex/5-configure-list-values/images/lov1.png b/forms-to-apex/5-configure-list-values/images/lov1.png new file mode 100644 index 000000000..9f2865c0b Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/lov1.png differ diff --git a/forms-to-apex/5-configure-list-values/images/make-current-scheme.png b/forms-to-apex/5-configure-list-values/images/make-current-scheme.png new file mode 100644 index 000000000..80c5ae545 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/make-current-scheme.png differ diff --git a/forms-to-apex/5-configure-list-values/images/menu.png b/forms-to-apex/5-configure-list-values/images/menu.png new file mode 100644 index 000000000..b8390380f Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/menu.png differ diff --git a/forms-to-apex/5-configure-list-values/images/modernization.png b/forms-to-apex/5-configure-list-values/images/modernization.png new file mode 100644 index 000000000..32d14bd51 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/modernization.png differ diff --git a/forms-to-apex/5-configure-list-values/images/name-dynamic-next.png b/forms-to-apex/5-configure-list-values/images/name-dynamic-next.png new file mode 100644 index 000000000..f1ff625f5 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/name-dynamic-next.png differ diff --git a/forms-to-apex/5-configure-list-values/images/name-static-next.png b/forms-to-apex/5-configure-list-values/images/name-static-next.png new file mode 100644 index 000000000..da424815f Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/name-static-next.png differ diff --git a/forms-to-apex/5-configure-list-values/images/nav-app-id.png b/forms-to-apex/5-configure-list-values/images/nav-app-id.png new file mode 100644 index 000000000..abccbf46b Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/nav-app-id.png differ diff --git a/forms-to-apex/5-configure-list-values/images/nav-app-id1.png b/forms-to-apex/5-configure-list-values/images/nav-app-id1.png new file mode 100644 index 000000000..fa06c346e Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/nav-app-id1.png differ diff --git a/forms-to-apex/5-configure-list-values/images/nav-menu2.png b/forms-to-apex/5-configure-list-values/images/nav-menu2.png new file mode 100644 index 000000000..ffec5c400 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/nav-menu2.png differ diff --git a/forms-to-apex/5-configure-list-values/images/nav-menu3.png b/forms-to-apex/5-configure-list-values/images/nav-menu3.png new file mode 100644 index 000000000..8fee5eb64 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/nav-menu3.png differ diff --git a/forms-to-apex/5-configure-list-values/images/nav-to-search.png b/forms-to-apex/5-configure-list-values/images/nav-to-search.png new file mode 100644 index 000000000..89aa130dd Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/nav-to-search.png differ diff --git a/forms-to-apex/5-configure-list-values/images/nav-to-search1.png b/forms-to-apex/5-configure-list-values/images/nav-to-search1.png new file mode 100644 index 000000000..228c050f2 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/nav-to-search1.png differ diff --git a/forms-to-apex/5-configure-list-values/images/navigation-menu.png b/forms-to-apex/5-configure-list-values/images/navigation-menu.png new file mode 100644 index 000000000..1f40b15ed Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/navigation-menu.png differ diff --git a/forms-to-apex/5-configure-list-values/images/no-authentication.png b/forms-to-apex/5-configure-list-values/images/no-authentication.png new file mode 100644 index 000000000..2fd002b44 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/no-authentication.png differ diff --git a/forms-to-apex/5-configure-list-values/images/ok-current-scheme.png b/forms-to-apex/5-configure-list-values/images/ok-current-scheme.png new file mode 100644 index 000000000..cd38047dd Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/ok-current-scheme.png differ diff --git a/forms-to-apex/5-configure-list-values/images/order-nav.png b/forms-to-apex/5-configure-list-values/images/order-nav.png new file mode 100644 index 000000000..a871b40b4 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/order-nav.png differ diff --git a/forms-to-apex/5-configure-list-values/images/parent-list.png b/forms-to-apex/5-configure-list-values/images/parent-list.png new file mode 100644 index 000000000..b96199c15 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/parent-list.png differ diff --git a/forms-to-apex/5-configure-list-values/images/prim-apply.png b/forms-to-apex/5-configure-list-values/images/prim-apply.png new file mode 100644 index 000000000..b9a4fbbdb Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/prim-apply.png differ diff --git a/forms-to-apex/5-configure-list-values/images/primary-apply.png b/forms-to-apex/5-configure-list-values/images/primary-apply.png new file mode 100644 index 000000000..9b1b28794 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/primary-apply.png differ diff --git a/forms-to-apex/5-configure-list-values/images/primary-apply1.png b/forms-to-apex/5-configure-list-values/images/primary-apply1.png new file mode 100644 index 000000000..2c4e8cb3d Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/primary-apply1.png differ diff --git a/forms-to-apex/5-configure-list-values/images/product-next.png b/forms-to-apex/5-configure-list-values/images/product-next.png new file mode 100644 index 000000000..0cfa2e552 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/product-next.png differ diff --git a/forms-to-apex/5-configure-list-values/images/run-app2.png b/forms-to-apex/5-configure-list-values/images/run-app2.png new file mode 100644 index 000000000..712a85d46 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/run-app2.png differ diff --git a/forms-to-apex/5-configure-list-values/images/sales-rep-lov.png b/forms-to-apex/5-configure-list-values/images/sales-rep-lov.png new file mode 100644 index 000000000..24f698f52 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/sales-rep-lov.png differ diff --git a/forms-to-apex/5-configure-list-values/images/sales-rep-lov1.png b/forms-to-apex/5-configure-list-values/images/sales-rep-lov1.png new file mode 100644 index 000000000..df13be2fe Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/sales-rep-lov1.png differ diff --git a/forms-to-apex/5-configure-list-values/images/save-report.png b/forms-to-apex/5-configure-list-values/images/save-report.png new file mode 100644 index 000000000..ac63affe3 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/save-report.png differ diff --git a/forms-to-apex/5-configure-list-values/images/save-report1.png b/forms-to-apex/5-configure-list-values/images/save-report1.png new file mode 100644 index 000000000..b695ee55e Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/save-report1.png differ diff --git a/forms-to-apex/5-configure-list-values/images/save-report11.png b/forms-to-apex/5-configure-list-values/images/save-report11.png new file mode 100644 index 000000000..ce8a99356 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/save-report11.png differ diff --git a/forms-to-apex/5-configure-list-values/images/scratch-lov.png b/forms-to-apex/5-configure-list-values/images/scratch-lov.png new file mode 100644 index 000000000..35e282106 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/scratch-lov.png differ diff --git a/forms-to-apex/5-configure-list-values/images/select-cust.png b/forms-to-apex/5-configure-list-values/images/select-cust.png new file mode 100644 index 000000000..f06027c0f Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/select-cust.png differ diff --git a/forms-to-apex/5-configure-list-values/images/select-cust1.png b/forms-to-apex/5-configure-list-values/images/select-cust1.png new file mode 100644 index 000000000..081c6ea7f Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/select-cust1.png differ diff --git a/forms-to-apex/5-configure-list-values/images/sequence-items.png b/forms-to-apex/5-configure-list-values/images/sequence-items.png new file mode 100644 index 000000000..23f78a900 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/sequence-items.png differ diff --git a/forms-to-apex/5-configure-list-values/images/sequence.png b/forms-to-apex/5-configure-list-values/images/sequence.png new file mode 100644 index 000000000..4afd31cb6 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/sequence.png differ diff --git a/forms-to-apex/5-configure-list-values/images/shared-comp3.png b/forms-to-apex/5-configure-list-values/images/shared-comp3.png new file mode 100644 index 000000000..f8f1cfec7 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/shared-comp3.png differ diff --git a/forms-to-apex/5-configure-list-values/images/shared-comps.png b/forms-to-apex/5-configure-list-values/images/shared-comps.png new file mode 100644 index 000000000..62690c798 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/shared-comps.png differ diff --git a/forms-to-apex/5-configure-list-values/images/shared-comps2.png b/forms-to-apex/5-configure-list-values/images/shared-comps2.png new file mode 100644 index 000000000..c84a9f5ac Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/shared-comps2.png differ diff --git a/forms-to-apex/5-configure-list-values/images/sql-query.png b/forms-to-apex/5-configure-list-values/images/sql-query.png new file mode 100644 index 000000000..b49d83809 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/sql-query.png differ diff --git a/forms-to-apex/5-configure-list-values/images/sql-query1.png b/forms-to-apex/5-configure-list-values/images/sql-query1.png new file mode 100644 index 000000000..d79500afc Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/sql-query1.png differ diff --git a/forms-to-apex/5-configure-list-values/images/sratch-next.png b/forms-to-apex/5-configure-list-values/images/sratch-next.png new file mode 100644 index 000000000..7e0182c97 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/sratch-next.png differ diff --git a/forms-to-apex/5-configure-list-values/images/values-lov.png b/forms-to-apex/5-configure-list-values/images/values-lov.png new file mode 100644 index 000000000..5d5942795 Binary files /dev/null and b/forms-to-apex/5-configure-list-values/images/values-lov.png differ diff --git a/forms-to-apex/6-item-form/6-item-form.md b/forms-to-apex/6-item-form/6-item-form.md new file mode 100644 index 000000000..19e287f46 --- /dev/null +++ b/forms-to-apex/6-item-form/6-item-form.md @@ -0,0 +1,160 @@ +# Create the Items Form + +## Introduction + +In this lab, you will learn how to create a form for managing items, ensure proper validation of user inputs, implement dynamic actions to enhance user interaction, and create processes to automate backend tasks. By completing these tasks, you will gain hands-on experience in building a functional and user-friendly application interface using Oracle APEX. + +Estimated Time: 10 Minutes + +### Objectives + +In this lab, you: + +- Configure the form to interact with the S_ITEM table. +- Implement a dynamic action to automatically set the product price based on the selected product ID. +- Develop a process to automate the retrieval of the item ID. + +## Task 1: Create the Items Form + +1. Click **Application ID** to go to the application home page. + + ![App Builder](images/navigate-to-appid.png " ") + +2. Click **Create Page**. + + ![App Builder](images/create-form-page.png " ") + +3. Select **Form**. + + ![App Builder](images/select-form.png " ") + +4. On **Create Form** wizard, enter/select the following: + + - Page Number: **7** + + - Name: **Item - Details** + + - Page Mode: **Drawer** + + - Table/View Name: **S_ITEM** + + Click **Next**. + + ![App Builder](images/item-details.png " ") + +5. Under Primary Key: + + - Primary Key Column 1: **ORD\_ID (Number)** + + - Primary Key Column 2: **ITEM\_ID (Number)** + + Click **Create Page**. + + ![App Builder](images/item-detail-key.png " ") + +## Task 2: Create Validations + +The S_ITEM table has five columns required: ORD\_ID, ITEM\_ID, PRODUCT\_ID, PRICE, and QUANTITY. You must ensure that end-users enter or select a value for these items. + +1. In the left pane, select **Items - Details** region and expand the columns. While holding down the Ctrl key, click the columns: P7\_PRODUCT\_ID, P7\_PRICE, and P7\_QUANTITY. + + ![App Builder](images/item-details-page.png " ") + +2. In the property editor, apply the following changes: + + - Appearance > Template: **Required - Floating** + + - Validation > Value Required: **Toggle On** + + ![App Builder](images/select-items1.png " ") + +## Task 3: Create a Dynamic Action + +1. Navigate to **Item - Details** region, select **P7\_PRODUCT\_ID**, right-click and select **Create Dynamic Action**. + + ![App Builder](images/create-dynamic-actions1.png " ") + +2. In the property editor, under Identification > Name: enter **Get Product Price**. + + ![App Builder](images/get-product-price1.png " ") + +3. Navigate to the **Show** action, and enter/select the following: + + - Identification > Action: **Set Value** + + - Under Settings: + + - Set Type: **PL/SQL Function Body** + + - PL/SQL Function Body: Copy and paste the below code: + + ``` + + return PKG_MODERNIZATION.F_GET_PRODUCT_PRICE(p_product_id => :P7_PRODUCT_ID); + + ``` + + - Items to submit: **P7\_PRODUCT\_ID** + + - Affected Elements > Item(s): **P7\_PRICE** + + ![App Builder](images/set-value1.png " ") + +## Task 4: Create a Process + +1. Navigate to the **Processing** tab and right-click **Processes** and select **Create Process**. + + ![App Builder](images/create-process1.png " ") + +2. In the property editor, enter/select the following: + + - Under Identification: + + - Name: **Get Item Id** + + - Type: **Invoke API** + + - Under the Settings: + + - Package: **PKG\_MODERNIZATION** + + - Procedure or Function: **F\_GET\_ITEM\_ID** + + - Under the Server-side Condition: + + - Type: **Item is NULL** + + - Item: **P7\_ITEM\_ID** + + ![App Builder](images/get-item-id1.png " ") + +3. Under **Get Item Id** process, navigate to **Parameters**, and click **Function Result**. Update the following: + + - Value > Item: **P7\_ITEM\_ID** + + ![App Builder](images/function-result1.png " ") + +4. Click **p\_ord\_id**, and verify this information: + + - Value > Type: Item + + - Value > Item: **P7\_ORD\_ID** + + ![App Builder](images/p-ord-id.png " ") + +5. This new process should be the first process to be executed, drag and drop it before **Process from Item - Details**. + + ![App Builder](images/drag-process1.png " ") + +5. Lastly, navigate to **Rendering** tab, organize the items in the layout by dragging and dropping the items as per your preference and click **Save**. + + ![App Builder](images/drag-item1.png " ") + +## Summary + +In this lab, you created a functional form for managing items in Oracle APEX by configuring it to interact with the 'S\_ITEM' table. You implemented necessary validations to ensure required fields are completed by users and created a dynamic action to automatically set the product price based on the selected product ID using PL/SQL. Additionally, you developed a process to automate the retrieval of the item ID, ensuring it runs conditionally when the item ID is null. These tasks enhanced our skills in building user-friendly and efficient application interfaces. + +## Acknowledgements + +- **Author** - Monica Godoy, Senior Principal Product Manager ; Ankita Beri, Product Manager; Paolo Paolucci, Data Development Specialist; Victor Mendo, Data Development Specialist +- **Last Updated By/Date** - Ankita Beri, Product Manager, July 2024 diff --git a/forms-to-apex/6-item-form/images/create-dynamic-actions.png b/forms-to-apex/6-item-form/images/create-dynamic-actions.png new file mode 100644 index 000000000..9978c9464 Binary files /dev/null and b/forms-to-apex/6-item-form/images/create-dynamic-actions.png differ diff --git a/forms-to-apex/6-item-form/images/create-dynamic-actions1.png b/forms-to-apex/6-item-form/images/create-dynamic-actions1.png new file mode 100644 index 000000000..c7b137775 Binary files /dev/null and b/forms-to-apex/6-item-form/images/create-dynamic-actions1.png differ diff --git a/forms-to-apex/6-item-form/images/create-form-next.png b/forms-to-apex/6-item-form/images/create-form-next.png new file mode 100644 index 000000000..9a8589331 Binary files /dev/null and b/forms-to-apex/6-item-form/images/create-form-next.png differ diff --git a/forms-to-apex/6-item-form/images/create-form-next1.png b/forms-to-apex/6-item-form/images/create-form-next1.png new file mode 100644 index 000000000..b1a9481cb Binary files /dev/null and b/forms-to-apex/6-item-form/images/create-form-next1.png differ diff --git a/forms-to-apex/6-item-form/images/create-form-page.png b/forms-to-apex/6-item-form/images/create-form-page.png new file mode 100644 index 000000000..f9edbc07e Binary files /dev/null and b/forms-to-apex/6-item-form/images/create-form-page.png differ diff --git a/forms-to-apex/6-item-form/images/create-page.png b/forms-to-apex/6-item-form/images/create-page.png new file mode 100644 index 000000000..02da70a24 Binary files /dev/null and b/forms-to-apex/6-item-form/images/create-page.png differ diff --git a/forms-to-apex/6-item-form/images/create-process.png b/forms-to-apex/6-item-form/images/create-process.png new file mode 100644 index 000000000..20a27172f Binary files /dev/null and b/forms-to-apex/6-item-form/images/create-process.png differ diff --git a/forms-to-apex/6-item-form/images/create-process1.png b/forms-to-apex/6-item-form/images/create-process1.png new file mode 100644 index 000000000..54f703d8b Binary files /dev/null and b/forms-to-apex/6-item-form/images/create-process1.png differ diff --git a/forms-to-apex/6-item-form/images/del-ord-filled.png b/forms-to-apex/6-item-form/images/del-ord-filled.png new file mode 100644 index 000000000..7235f4130 Binary files /dev/null and b/forms-to-apex/6-item-form/images/del-ord-filled.png differ diff --git a/forms-to-apex/6-item-form/images/drag-item.png b/forms-to-apex/6-item-form/images/drag-item.png new file mode 100644 index 000000000..372704504 Binary files /dev/null and b/forms-to-apex/6-item-form/images/drag-item.png differ diff --git a/forms-to-apex/6-item-form/images/drag-item1.png b/forms-to-apex/6-item-form/images/drag-item1.png new file mode 100644 index 000000000..617bb9868 Binary files /dev/null and b/forms-to-apex/6-item-form/images/drag-item1.png differ diff --git a/forms-to-apex/6-item-form/images/drag-process.png b/forms-to-apex/6-item-form/images/drag-process.png new file mode 100644 index 000000000..9de783b1b Binary files /dev/null and b/forms-to-apex/6-item-form/images/drag-process.png differ diff --git a/forms-to-apex/6-item-form/images/drag-process1.png b/forms-to-apex/6-item-form/images/drag-process1.png new file mode 100644 index 000000000..70d6c7ce0 Binary files /dev/null and b/forms-to-apex/6-item-form/images/drag-process1.png differ diff --git a/forms-to-apex/6-item-form/images/function-result.png b/forms-to-apex/6-item-form/images/function-result.png new file mode 100644 index 000000000..dc2a0952e Binary files /dev/null and b/forms-to-apex/6-item-form/images/function-result.png differ diff --git a/forms-to-apex/6-item-form/images/function-result1.png b/forms-to-apex/6-item-form/images/function-result1.png new file mode 100644 index 000000000..52ab34a9c Binary files /dev/null and b/forms-to-apex/6-item-form/images/function-result1.png differ diff --git a/forms-to-apex/6-item-form/images/get-item-id.png b/forms-to-apex/6-item-form/images/get-item-id.png new file mode 100644 index 000000000..ece793928 Binary files /dev/null and b/forms-to-apex/6-item-form/images/get-item-id.png differ diff --git a/forms-to-apex/6-item-form/images/get-item-id1.png b/forms-to-apex/6-item-form/images/get-item-id1.png new file mode 100644 index 000000000..bf6fc4aaf Binary files /dev/null and b/forms-to-apex/6-item-form/images/get-item-id1.png differ diff --git a/forms-to-apex/6-item-form/images/get-product-price.png b/forms-to-apex/6-item-form/images/get-product-price.png new file mode 100644 index 000000000..1c3d9d5d5 Binary files /dev/null and b/forms-to-apex/6-item-form/images/get-product-price.png differ diff --git a/forms-to-apex/6-item-form/images/get-product-price1.png b/forms-to-apex/6-item-form/images/get-product-price1.png new file mode 100644 index 000000000..16d98e5d5 Binary files /dev/null and b/forms-to-apex/6-item-form/images/get-product-price1.png differ diff --git a/forms-to-apex/6-item-form/images/item-detail-key.png b/forms-to-apex/6-item-form/images/item-detail-key.png new file mode 100644 index 000000000..437760c18 Binary files /dev/null and b/forms-to-apex/6-item-form/images/item-detail-key.png differ diff --git a/forms-to-apex/6-item-form/images/item-details-page.png b/forms-to-apex/6-item-form/images/item-details-page.png new file mode 100644 index 000000000..b4810bcb2 Binary files /dev/null and b/forms-to-apex/6-item-form/images/item-details-page.png differ diff --git a/forms-to-apex/6-item-form/images/item-details.png b/forms-to-apex/6-item-form/images/item-details.png new file mode 100644 index 000000000..8d1f3f887 Binary files /dev/null and b/forms-to-apex/6-item-form/images/item-details.png differ diff --git a/forms-to-apex/6-item-form/images/navigate-to-5.png b/forms-to-apex/6-item-form/images/navigate-to-5.png new file mode 100644 index 000000000..beff469b8 Binary files /dev/null and b/forms-to-apex/6-item-form/images/navigate-to-5.png differ diff --git a/forms-to-apex/6-item-form/images/navigate-to-appid.png b/forms-to-apex/6-item-form/images/navigate-to-appid.png new file mode 100644 index 000000000..84cce7be8 Binary files /dev/null and b/forms-to-apex/6-item-form/images/navigate-to-appid.png differ diff --git a/forms-to-apex/6-item-form/images/order-report-region.png b/forms-to-apex/6-item-form/images/order-report-region.png new file mode 100644 index 000000000..a5272d5bf Binary files /dev/null and b/forms-to-apex/6-item-form/images/order-report-region.png differ diff --git a/forms-to-apex/6-item-form/images/p-ord-id.png b/forms-to-apex/6-item-form/images/p-ord-id.png new file mode 100644 index 000000000..0ff81ab6b Binary files /dev/null and b/forms-to-apex/6-item-form/images/p-ord-id.png differ diff --git a/forms-to-apex/6-item-form/images/select-form.png b/forms-to-apex/6-item-form/images/select-form.png new file mode 100644 index 000000000..820e88cd2 Binary files /dev/null and b/forms-to-apex/6-item-form/images/select-form.png differ diff --git a/forms-to-apex/6-item-form/images/select-items.png b/forms-to-apex/6-item-form/images/select-items.png new file mode 100644 index 000000000..43e4ce76c Binary files /dev/null and b/forms-to-apex/6-item-form/images/select-items.png differ diff --git a/forms-to-apex/6-item-form/images/select-items1.png b/forms-to-apex/6-item-form/images/select-items1.png new file mode 100644 index 000000000..0f5448f66 Binary files /dev/null and b/forms-to-apex/6-item-form/images/select-items1.png differ diff --git a/forms-to-apex/6-item-form/images/set-value.png b/forms-to-apex/6-item-form/images/set-value.png new file mode 100644 index 000000000..3f52b1e22 Binary files /dev/null and b/forms-to-apex/6-item-form/images/set-value.png differ diff --git a/forms-to-apex/6-item-form/images/set-value1.png b/forms-to-apex/6-item-form/images/set-value1.png new file mode 100644 index 000000000..c9bd70ff4 Binary files /dev/null and b/forms-to-apex/6-item-form/images/set-value1.png differ diff --git a/forms-to-apex/7-enhance-order-faceted/7-enhance-order-faceted.md b/forms-to-apex/7-enhance-order-faceted/7-enhance-order-faceted.md new file mode 100644 index 000000000..1af6694ed --- /dev/null +++ b/forms-to-apex/7-enhance-order-faceted/7-enhance-order-faceted.md @@ -0,0 +1,144 @@ +# Enhance the Orders Faceted Search Page + +## Introduction + +Let's recap what you have built so far for the orders form. In Lab 4, you created a faceted search and a form page to manage the orders. In this lab, you will enhance these pages and link it to the orders page you created. + +Please note that other options you can create are available in the wizard: + +- Option 1 - Master Detail - Stacked +- Option 2 - Master Detail - Side by Side +- Option 3 - Master Detail - Drill Down + +Run this [Sample App](http://bit.ly/ModernizingFormsToAPEX%C2%A0) to see the above options. + +Estimated Time: 5 Minutes + +### Objectives + +In this lab, you: + +- Remove an unnecessary facet from the orders faceted search page. +- Rename and customize the orders report region. +- Configure the ID column to link to the Order Details page. +- Create a button to facilitate creating new orders and link it to the order details page. + +## Task 1: Enhance the Orders Faceted Search Page + +The faceted search page was created with four facets: + +- Sales Representative +- Customer +- Payment Type +- Order Filled + +Since order filled is not a key facet search, let's remove it by following these steps: + +1. Navigate to the page finder and select the **Orders - Faceted Search**. + + ![App Builder](images/navigate-to-5.png " ") + +2. In the left pane, select **Search** region. Right-click **P5\_ORDER\_FILLED** and click **Delete**. + + ![App Builder](images/del-ord-filled.png " ") + +3. Now, navigate to the **Ord** region. In the property editor, update the following: + + - Identification > Name: **Orders Report** + + - Under Source: + + - Type: **SQL Query** + + - SQL Query: Copy and paste the below SQL query + + ``` + + SELECT id, + customer_id, + date_ordered, + date_shipped, + sales_rep_id, + (SELECT Sum(i.price * i.quantity) + FROM s_ord o + JOIN s_item i + ON o.id = i.ord_id + WHERE o.id = s_ord.id) TOTAL, + payment_type, + order_filled + FROM s_ord; + + ``` + + - Under Appearance: + + - Click **Template Options** : Header > **Visible: Default** + + Click **OK**. + + ![App Builder](images/ords-report.png " ") + + ![App Builder](images/order-report-region1.png " ") + +4. Expand the columns of the **Orders Report** region. Click the **ID** column and update the following: + + - Identification > Type: **Link** + + - Under Link: + + - Target > click **No Link Defined** + + - Page: **6** + + - Set Items > Name: **P6\_ID**, Value: **#ID#** + + - Clear Cache: **6** + + Click **OK**. + + ![App Builder](images/link.png " ") + +5. Click the **TOTAL** column and update the following: + + - Appearance > Format Mask: **FML999G999G999G999G990D00** + + ![App Builder](images/total-column.png " ") + +6. Right-click **Orders Report** region and select **Create Button**. + + ![App Builder](images/create-btn.png " ") + +7. In the property editor, enter/select the following: + + - Identification > Button Name: **NEW_ORDER** + + - Layout > Slot: **Edit** + + - Appearance > Hot: **Toggle On** + + - Under Behavior: + + - Action: **Redirect to Page in this Application** + + - Target: click **No Link Defined** + + - Page: **6** + + - Clear Cache: **6** + + Click **OK**. + + ![App Builder](images/new-order-btn.png " ") + + ![App Builder](images/redirect-btn1.png " ") + +8. Click **Save**. + +## Summary + +In this lab, you learned how to enhance the orders faceted search page by removing non-essential facets and improving the overall functionality and appearance. Additionally, you configured the ID column to act as a link to another page and created a button for easy navigation to the order creation page. + +## Acknowledgements + +- **Author** - Monica Godoy, Senior Principal Product Manager ; Ankita Beri, Product Manager; Paolo Paolucci, Data Development Specialist; Victor Mendo, Data Development Specialist +- **Last Updated By/Date** - Ankita Beri, Product Manager, July 2024 diff --git a/forms-to-apex/7-enhance-order-faceted/images/create-btn.png b/forms-to-apex/7-enhance-order-faceted/images/create-btn.png new file mode 100644 index 000000000..778816087 Binary files /dev/null and b/forms-to-apex/7-enhance-order-faceted/images/create-btn.png differ diff --git a/forms-to-apex/7-enhance-order-faceted/images/create-button.png b/forms-to-apex/7-enhance-order-faceted/images/create-button.png new file mode 100644 index 000000000..1f0618b32 Binary files /dev/null and b/forms-to-apex/7-enhance-order-faceted/images/create-button.png differ diff --git a/forms-to-apex/7-enhance-order-faceted/images/del-ord-filled.png b/forms-to-apex/7-enhance-order-faceted/images/del-ord-filled.png new file mode 100644 index 000000000..7235f4130 Binary files /dev/null and b/forms-to-apex/7-enhance-order-faceted/images/del-ord-filled.png differ diff --git a/forms-to-apex/7-enhance-order-faceted/images/delete-facet.png b/forms-to-apex/7-enhance-order-faceted/images/delete-facet.png new file mode 100644 index 000000000..a5d077487 Binary files /dev/null and b/forms-to-apex/7-enhance-order-faceted/images/delete-facet.png differ diff --git a/forms-to-apex/7-enhance-order-faceted/images/link-button.png b/forms-to-apex/7-enhance-order-faceted/images/link-button.png new file mode 100644 index 000000000..bd8e3985a Binary files /dev/null and b/forms-to-apex/7-enhance-order-faceted/images/link-button.png differ diff --git a/forms-to-apex/7-enhance-order-faceted/images/link-button1.png b/forms-to-apex/7-enhance-order-faceted/images/link-button1.png new file mode 100644 index 000000000..f0a2f6619 Binary files /dev/null and b/forms-to-apex/7-enhance-order-faceted/images/link-button1.png differ diff --git a/forms-to-apex/7-enhance-order-faceted/images/link-id.png b/forms-to-apex/7-enhance-order-faceted/images/link-id.png new file mode 100644 index 000000000..bb4f7ffb4 Binary files /dev/null and b/forms-to-apex/7-enhance-order-faceted/images/link-id.png differ diff --git a/forms-to-apex/7-enhance-order-faceted/images/link.png b/forms-to-apex/7-enhance-order-faceted/images/link.png new file mode 100644 index 000000000..8d000e411 Binary files /dev/null and b/forms-to-apex/7-enhance-order-faceted/images/link.png differ diff --git a/forms-to-apex/7-enhance-order-faceted/images/navigate-to-5.png b/forms-to-apex/7-enhance-order-faceted/images/navigate-to-5.png new file mode 100644 index 000000000..beff469b8 Binary files /dev/null and b/forms-to-apex/7-enhance-order-faceted/images/navigate-to-5.png differ diff --git a/forms-to-apex/7-enhance-order-faceted/images/new-order-btn.png b/forms-to-apex/7-enhance-order-faceted/images/new-order-btn.png new file mode 100644 index 000000000..ad3011348 Binary files /dev/null and b/forms-to-apex/7-enhance-order-faceted/images/new-order-btn.png differ diff --git a/forms-to-apex/7-enhance-order-faceted/images/order-report-region.png b/forms-to-apex/7-enhance-order-faceted/images/order-report-region.png new file mode 100644 index 000000000..a5272d5bf Binary files /dev/null and b/forms-to-apex/7-enhance-order-faceted/images/order-report-region.png differ diff --git a/forms-to-apex/7-enhance-order-faceted/images/order-report-region1.png b/forms-to-apex/7-enhance-order-faceted/images/order-report-region1.png new file mode 100644 index 000000000..a9dc264e1 Binary files /dev/null and b/forms-to-apex/7-enhance-order-faceted/images/order-report-region1.png differ diff --git a/forms-to-apex/7-enhance-order-faceted/images/orders-report.png b/forms-to-apex/7-enhance-order-faceted/images/orders-report.png new file mode 100644 index 000000000..03561bf89 Binary files /dev/null and b/forms-to-apex/7-enhance-order-faceted/images/orders-report.png differ diff --git a/forms-to-apex/7-enhance-order-faceted/images/orders-report1.png b/forms-to-apex/7-enhance-order-faceted/images/orders-report1.png new file mode 100644 index 000000000..9695f21da Binary files /dev/null and b/forms-to-apex/7-enhance-order-faceted/images/orders-report1.png differ diff --git a/forms-to-apex/7-enhance-order-faceted/images/ords-report.png b/forms-to-apex/7-enhance-order-faceted/images/ords-report.png new file mode 100644 index 000000000..f7efb08ce Binary files /dev/null and b/forms-to-apex/7-enhance-order-faceted/images/ords-report.png differ diff --git a/forms-to-apex/7-enhance-order-faceted/images/page-finder-7.png b/forms-to-apex/7-enhance-order-faceted/images/page-finder-7.png new file mode 100644 index 000000000..2fd923578 Binary files /dev/null and b/forms-to-apex/7-enhance-order-faceted/images/page-finder-7.png differ diff --git a/forms-to-apex/7-enhance-order-faceted/images/page-finder-9.png b/forms-to-apex/7-enhance-order-faceted/images/page-finder-9.png new file mode 100644 index 000000000..55e77ad4e Binary files /dev/null and b/forms-to-apex/7-enhance-order-faceted/images/page-finder-9.png differ diff --git a/forms-to-apex/7-enhance-order-faceted/images/redirect-btn.png b/forms-to-apex/7-enhance-order-faceted/images/redirect-btn.png new file mode 100644 index 000000000..0b1c8db88 Binary files /dev/null and b/forms-to-apex/7-enhance-order-faceted/images/redirect-btn.png differ diff --git a/forms-to-apex/7-enhance-order-faceted/images/redirect-btn1.png b/forms-to-apex/7-enhance-order-faceted/images/redirect-btn1.png new file mode 100644 index 000000000..5d628de23 Binary files /dev/null and b/forms-to-apex/7-enhance-order-faceted/images/redirect-btn1.png differ diff --git a/forms-to-apex/7-enhance-order-faceted/images/total-column.png b/forms-to-apex/7-enhance-order-faceted/images/total-column.png new file mode 100644 index 000000000..ac3851dbd Binary files /dev/null and b/forms-to-apex/7-enhance-order-faceted/images/total-column.png differ diff --git a/forms-to-apex/8-enhance-order-form/8-enhance-order-faceted.md b/forms-to-apex/8-enhance-order-form/8-enhance-order-faceted.md new file mode 100644 index 000000000..7671ff2fa --- /dev/null +++ b/forms-to-apex/8-enhance-order-form/8-enhance-order-faceted.md @@ -0,0 +1,305 @@ +# Enhance the Orders Form Page + +## Introduction + +In this lab, you will review specific updates to form items, including hiding certain fields, configuring validation and appearance settings, and organizing the layout for a better user experience. + +Estimated Time: 5 Minutes + +### Objectives + +In this lab, you: + +- Enhance the orders form page with hidden fields, validation, and layout improvements. +- Create a validation to ensure correct order and ship dates. +- Add an interactive report for order items. +- Implement dynamic actions to refresh the report. + +## Task 1: Enhance the Orders Form Page + +1. Navigate to the page finder and select the **Orders Form**. + + ![App Builder](images/nav-to-orders-form.png " ") + +2. Navigate to the **Ord** region and while holding down the Ctrl key, click the columns: **P6\_TOTAL** and **P6\_ORDER\_FILLED** and update type to **Hidden**. Drag **P6\_TOTAL** and drop under **P6\_ORDER\_FILLED**. + + ![App Builder](images/total-hidden.png " ") + +3. While holding down the Ctrl key, select the items: **P6\_DATE\_ORDERED, P6\_DATE\_SHIPPED, P6\_SALES\_REP\_ID and P6\_PAYMENT\_TYPE** and in the property editor, update the following: + + - Appearance > Template: **Required-Floating** + + - Validation > Value Required: **Toggle On** + + ![App Builder](images/required-floating.png " ") + +4. Select **P6\_PAYMENT\_TYPE** and enter/select the following: + + - Identification > Type: **Radio Group** + + - Settings > Number of Columns: **3** + + - Under Appearance: + + - Template Options: Click **Use Template Defaults** + + - Item Group Display: **Display as Pill Button** + + - Click **OK**. + + - Under List of Values: + + - Type: **Shared Component** + + - List of Values: **S\_ORD.PAYMENT\_TYPE** + + - Display Extra Values attribute: **Toggle Off** + + - Display Null Value attribute: **Toggle Off** + + ![App Builder](images/payment-type.png " ") + + ![App Builder](images/payment-type-lov.png " ") + +5. To organize the items, drag and drop them like in the screenshot below and click **Save**. + + ![App Builder](images/payment-type-save.png " ") + +## Task 2: Create Validations + +In this task, you will create a validation in the orders form to validate that the ship date is not happening before the order date. Please see the validation in the Orders sample form. + + ![App Builder](images/forms-validation.png " ") + +1. Go to the **Processing** tab in the left pane. Right-click **Validating** and select **Create Validation**. + + ![App Builder](images/create-validation.png " ") + +2. In the property editor, enter/select the following: + + - Identification > Name: **Validate Order Dates** + + - Under Validation: + + - Type: **Expression** + + - Language: **SQL** + + - SQL Expression: **:P6\_DATE\_SHIPPED > :P6\_DATE\_ORDERED** + + - Under Error: + + - Error Message: **Ship date is before order date!** + + - Associated Item: **P6\_DATE\_SHIPPED** + + ![App Builder](images/validate-order-dates.png " ") + +3. Click **Save**. + +## Task 3: Create the Items Report + +1. Navigate to **Rendering** pane, and right-click **Ord** region and select **Create Sub Region**. + + ![App Builder](images/create-sub-region.png " ") + +2. In the property editor, enter/select the following: + + - Under Identification: + + - Name: **Items** + + - Type: **Interactive Report** + + - Under Source: + + - Table Name: **S\_ITEM** + + - Where Clause: **ORD\_ID = :P6\_ID** + + - Page Items to Submit: **P6\_ID** + + - Under Server-side Condition: + + - Type: **Item is NOT NULL** + + - Item: **P6\_ID** + + ![App Builder](images/item-region.png " ") + + ![App Builder](images/server-side.png " ") + +3. Expand the columns for the **Items** region. +Hold the ctrl key while you click **ORD\_ID** and **ITEM\_ID** and change the type to **Hidden**. + + ![App Builder](images/item-columns-hidden.png " ") + +4. Right-click **Items** region and select **Create Button**. + + ![App Builder](images/create-button1.png " ") + +5. In the property editor, enter/select the following: + + - Identification > Button Name: **ADD\_ITEM** + + - Layout > Slot: **Right of Interactive Report Search Bar** + + - Under Appearance: + + - Button Template: **Text with Icon** + + - Hot: **Toggle On** + + - Icon: **fa-plus-circle** + + - Under Behavior: + + - Action: **Redirect to Page in this Application** + + - Target: click **No Link Defined** + + - Page: **7** + + - Set Items > Name: **P7\_ORD\_ID** , Value: **&P6\_ID.** + + - Clear Cache: **7** + + Click **OK**. + + ![App Builder](images/add-item-btn.png " ") + +6. Select **Items** region, navigate to the **Attributes** pane and enter/select the following: + + - Under Link: + + - Link Column: **Link to Custom Target** + + - Target: click **No Link Defined** + + - Page: **7** + + - Set Item as follows: + + | Name | Value | + | ---- | ----- | + | P7\_ORD\_ID | #ORD_ID# | + | P7\_ITEM\_ID| #ITEM_ID# | + + - Clear cache: **7** + + Click **OK**. + + ![App Builder](images/attributes.png " ") + +7. Under **Items** region, click **PRODUCT_ID** column and enter/select the following: + + - Identification > Type: **Plain Text (based on List of Values)** + + - List of Values > List of Values: **S_PRODUCT.NAME** + + - Heading > Heading: **Product** + + ![App Builder](images/product-id.png " ") + +8. Click **Save**. + +## Task 4: Create Dynamic Action + +1. In the left pane, go to the **Dynamic Actions** tab. Right-click **Dialog Closed** and select **Create Dynamic Action**. + + ![App Builder](images/create-dynamic-action.png " ") + +2. In the property editor, enter/select the following: + + - Identification > Name: **Refresh Items Report** + + - Under When: + + - Selection Type > **Region** + + - Region > **Items** + + ![App Builder](images/refresh.png " ") + +3. Click **Refresh** action and select the following: + + - Affected Elements > Region: **Items** + + ![App Builder](images/refresh1.png " ") + +4. Click **Save**. + +## Task 5: Enhance the Cancel Button + +1. Navigate to **Rendering** pane, under **Buttons** region, click **Cancel** and in the property editor, update the following: + + - Under Behavior: + + - Action: **Redirect to Page in this Application** + + - Target: Select Page **5** + + - Click **OK**. + + ![App Builder](images/redirect-to-7.png " ") + +2. Click **Save**. + +## Task 6: Run the Application + +1. Run the application and go to the **Orders - Faceted Search** page. Click any **ID** of the orders created. + + ![App Builder](images/edit-order.png " ") + +2. Click **Actions**. Select **Data > Compute**. + + ![App Builder](images/compute1.png " ") + +3. Enter/select the following: + + - Column Label: **Item Total** + + - Format Mask: **FML999G999G999G999G990D00** + + - Computation Expression: **D*E** + + Click **Apply**. + + ![App Builder](images/compute-apply1.png " ") + +4. Click **Actions** menu. Select **Data > Aggregate** + + - Function: **Sum** + + - Column: **Item Total** + + Click **Apply**. + + ![App Builder](images/aggregate.png " ") + + ![App Builder](images/sum-total.png " ") + + ![App Builder](images/item-total.png " ") + +5. Click **Actions** menu. Select **Report > Save Report** + + - For save, select As Default Report Settings. + + - Default Report Type: **Primary** + + Click **Apply**. + + ![App Builder](images/save-report-item.png " ") + + ![App Builder](images/apply-save.png " ") + + ![App Builder](images/primary-apply.png " ") + +## Summary + +In this lab, we enhanced the orders form page. You converted the payment type selection into a visually appealing radio group and created validations to ensure the ship date is not before the order date. Additionally, you added an interactive report for items, a dynamic action to refresh the report and configure buttons for better navigation and functionality. + +## Acknowledgements + +- **Author** - Monica Godoy, Senior Principal Product Manager ; Ankita Beri, Product Manager; Paolo Paolucci, Data Development Specialist; Victor Mendo, Data Development Specialist +- **Last Updated By/Date** - Ankita Beri, Product Manager, August 2024 diff --git a/forms-to-apex/8-enhance-order-form/images/add-item-btn.png b/forms-to-apex/8-enhance-order-form/images/add-item-btn.png new file mode 100644 index 000000000..739fa0856 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/add-item-btn.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/add-item-page.png b/forms-to-apex/8-enhance-order-form/images/add-item-page.png new file mode 100644 index 000000000..3614a7dd5 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/add-item-page.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/add-item.png b/forms-to-apex/8-enhance-order-form/images/add-item.png new file mode 100644 index 000000000..fa223fb43 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/add-item.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/aggregate.png b/forms-to-apex/8-enhance-order-form/images/aggregate.png new file mode 100644 index 000000000..a330b4f9f Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/aggregate.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/apply-save.png b/forms-to-apex/8-enhance-order-form/images/apply-save.png new file mode 100644 index 000000000..12f34e467 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/apply-save.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/attributes.png b/forms-to-apex/8-enhance-order-form/images/attributes.png new file mode 100644 index 000000000..927396106 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/attributes.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/cancel-btn.png b/forms-to-apex/8-enhance-order-form/images/cancel-btn.png new file mode 100644 index 000000000..3d3ec73c3 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/cancel-btn.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/compute-apply.png b/forms-to-apex/8-enhance-order-form/images/compute-apply.png new file mode 100644 index 000000000..d6463fd16 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/compute-apply.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/compute-apply1.png b/forms-to-apex/8-enhance-order-form/images/compute-apply1.png new file mode 100644 index 000000000..92725db60 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/compute-apply1.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/compute.png b/forms-to-apex/8-enhance-order-form/images/compute.png new file mode 100644 index 000000000..6f95a5550 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/compute.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/compute1.png b/forms-to-apex/8-enhance-order-form/images/compute1.png new file mode 100644 index 000000000..837e78afe Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/compute1.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/create-button1.png b/forms-to-apex/8-enhance-order-form/images/create-button1.png new file mode 100644 index 000000000..820113098 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/create-button1.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/create-dynamic-action.png b/forms-to-apex/8-enhance-order-form/images/create-dynamic-action.png new file mode 100644 index 000000000..c338707db Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/create-dynamic-action.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/create-sub-region.png b/forms-to-apex/8-enhance-order-form/images/create-sub-region.png new file mode 100644 index 000000000..9b882845b Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/create-sub-region.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/create-validation.png b/forms-to-apex/8-enhance-order-form/images/create-validation.png new file mode 100644 index 000000000..64ca23cb2 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/create-validation.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/edit-order.png b/forms-to-apex/8-enhance-order-form/images/edit-order.png new file mode 100644 index 000000000..9d42a7b97 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/edit-order.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/forms-validation.png b/forms-to-apex/8-enhance-order-form/images/forms-validation.png new file mode 100644 index 000000000..4e80d02cd Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/forms-validation.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/item-columns-hidden.png b/forms-to-apex/8-enhance-order-form/images/item-columns-hidden.png new file mode 100644 index 000000000..cc0c72cd1 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/item-columns-hidden.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/item-region.png b/forms-to-apex/8-enhance-order-form/images/item-region.png new file mode 100644 index 000000000..22a731976 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/item-region.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/item-total-sum.png b/forms-to-apex/8-enhance-order-form/images/item-total-sum.png new file mode 100644 index 000000000..598010da9 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/item-total-sum.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/item-total.png b/forms-to-apex/8-enhance-order-form/images/item-total.png new file mode 100644 index 000000000..8082f0fda Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/item-total.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/nav-to-orders-form.png b/forms-to-apex/8-enhance-order-form/images/nav-to-orders-form.png new file mode 100644 index 000000000..3ce8a993d Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/nav-to-orders-form.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/navigate-to-9.png b/forms-to-apex/8-enhance-order-form/images/navigate-to-9.png new file mode 100644 index 000000000..16e802254 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/navigate-to-9.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/new-order-btn.png b/forms-to-apex/8-enhance-order-form/images/new-order-btn.png new file mode 100644 index 000000000..32295add1 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/new-order-btn.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/new-order-drawer.png b/forms-to-apex/8-enhance-order-form/images/new-order-drawer.png new file mode 100644 index 000000000..43e0a5e87 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/new-order-drawer.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/new-order-edit.png b/forms-to-apex/8-enhance-order-form/images/new-order-edit.png new file mode 100644 index 000000000..6184e2320 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/new-order-edit.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/order-filled-hidden.png b/forms-to-apex/8-enhance-order-form/images/order-filled-hidden.png new file mode 100644 index 000000000..b766f5a9f Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/order-filled-hidden.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/payment-type-lov.png b/forms-to-apex/8-enhance-order-form/images/payment-type-lov.png new file mode 100644 index 000000000..25219061f Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/payment-type-lov.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/payment-type-radio.png b/forms-to-apex/8-enhance-order-form/images/payment-type-radio.png new file mode 100644 index 000000000..04fef844b Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/payment-type-radio.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/payment-type-save.png b/forms-to-apex/8-enhance-order-form/images/payment-type-save.png new file mode 100644 index 000000000..df54322cb Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/payment-type-save.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/payment-type.png b/forms-to-apex/8-enhance-order-form/images/payment-type.png new file mode 100644 index 000000000..85080893b Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/payment-type.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/primary-apply.png b/forms-to-apex/8-enhance-order-form/images/primary-apply.png new file mode 100644 index 000000000..8e29ae45a Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/primary-apply.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/product-id.png b/forms-to-apex/8-enhance-order-form/images/product-id.png new file mode 100644 index 000000000..094751438 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/product-id.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/redirect-to-7.png b/forms-to-apex/8-enhance-order-form/images/redirect-to-7.png new file mode 100644 index 000000000..280a85034 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/redirect-to-7.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/refresh.png b/forms-to-apex/8-enhance-order-form/images/refresh.png new file mode 100644 index 000000000..acc08c276 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/refresh.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/refresh1.png b/forms-to-apex/8-enhance-order-form/images/refresh1.png new file mode 100644 index 000000000..41efdd439 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/refresh1.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/required-floating.png b/forms-to-apex/8-enhance-order-form/images/required-floating.png new file mode 100644 index 000000000..06ef22228 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/required-floating.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/save-report-item.png b/forms-to-apex/8-enhance-order-form/images/save-report-item.png new file mode 100644 index 000000000..fd8b6b842 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/save-report-item.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/server-side.png b/forms-to-apex/8-enhance-order-form/images/server-side.png new file mode 100644 index 000000000..73980ab38 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/server-side.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/sum-total.png b/forms-to-apex/8-enhance-order-form/images/sum-total.png new file mode 100644 index 000000000..4f3f17087 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/sum-total.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/total-hidden.png b/forms-to-apex/8-enhance-order-form/images/total-hidden.png new file mode 100644 index 000000000..6c1f4b2c5 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/total-hidden.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/validate-order-dates.png b/forms-to-apex/8-enhance-order-form/images/validate-order-dates.png new file mode 100644 index 000000000..36bd44419 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/validate-order-dates.png differ diff --git a/forms-to-apex/8-enhance-order-form/images/validate-order.png b/forms-to-apex/8-enhance-order-form/images/validate-order.png new file mode 100644 index 000000000..c07121c84 Binary files /dev/null and b/forms-to-apex/8-enhance-order-form/images/validate-order.png differ diff --git a/forms-to-apex/9-enhance-apex-app/9-enhance-apex-app.md b/forms-to-apex/9-enhance-apex-app/9-enhance-apex-app.md new file mode 100644 index 000000000..45ea569c9 --- /dev/null +++ b/forms-to-apex/9-enhance-apex-app/9-enhance-apex-app.md @@ -0,0 +1,299 @@ +# Enhance Your APEX App + +## Introduction + +After following the guidelines in the previous labs on best practices to modernize Forms in APEX, you will learn how to enhance pages in your app, the navigation menu, and the authentication scheme. + +Estimated Time: 10 Minutes + +### Objectives + +In this lab, you: + +- Define and organize facets for the faceted search page to filter data effectively. +- Define and personalize the interactive report views, allowing end-users to interact with and save their report configurations. +- Create and organize navigation menu entries for customers and orders, and assign appropriate parent list entries to make the menu cleaner and more user-friendly. +- Disable authentication to make the application publicly accessible, suitable for a public-facing application. + +## Task 1: Customize the Customer Form + +When the wizard creates a form, an item is automatically created for each column in the table. Depending on the column type, it creates a Text Field, Text Area, Date Picker, or Number Field item. + +Once the page is created, you can make the changes you need. Select a different type of element, edit the label and more. Moreover, you can organize items by dragging and drop them. + +To use the list of values previously created: + +1. Navigate to the page finder and select **Customer** Page. + + ![App Builder](images/nav-app-id1.png " ") + +2. Organize items by dragging and dropping them as shown in the screenshot below. + + ![App Builder](images/sequence-items.png " ") + +3. In the left pane, select **P3\_ADDRESS**. In the property editor, update the following: + + - Identification > Type: **Text Field** + + ![App Builder](images/hidden-address.png " ") + +4. Select **P3\_CREDIT\_RATING**. In the property editor, update the following: + + - Identification > Type: **Radio Group** + + - Settings > Number of Columns: **3** + + - Under List of Values: + + - Type: **Shared Component** + + - List of Values: **S\_CUSTOMER.CREDIT\_RATING** + + - Display Extra Values: **Toggle Off** + + - Display Null Value: **Toggle Off** + + ![App Builder](images/credit-rate-radio.png " ") + +5. Click **Save**. + +## Task 2: Customize the Faceted Search + +You can define which facets to filter the data. Some are defined automatically, but you can create or delete them as needed. You can also drag and drop facets to change their display order. + +1. Navigate to the page finder and select the **Customer - Faceted Search** Page. + + ![App Builder](images/nav-to-search.png " ") + +2. In the left pane, under **Search**, right-click **Facets** and click **Create Facet**. + + ![App Builder](images/create-facets1.png " ") + +3. Create the following three facets one after the other: + + | NAME | TYPE | LABEL | LIST OF VALUES TYPE | LIST OF VALUES | + |----- | ----- | ----- | -------------------- | -------------- | + |P2\_CITY | Checkbox Group | City | Distinct Values | | + | P2\_NAME | Checkbox Group | Name | Distinct Values | | + | P2\_SALES\_REP\_ID | Checkbox Group |Sales Rep | Shared Component| SALES\_REP\_LOV| + {: title="Facets"} + + ![App Builder](images/city-facet.png " ") + + ![App Builder](images/name-facet.png " ") + + ![App Builder](images/sales-rep-lov1.png " ") + +4. Now organize the facets in the following order: + - P2\_CREDIT\_RATING + - P2\_REGION\_ID + - P2\_COUNTRY + - P2\_CITY + - P2\_NAME + - P2\_SALES\_REP\_ID + + ![App Builder](images/sequence.png " ") + +5. Click Save. + +## Task 3: Customize the Interactive Report + +In this task, you will define how end-users can interact with and personalize their report views using Oracle APEX Interactive Reports. Interactive reports offer a powerful way to present data, allowing both developers and end-users to tailor the reports to their needs. Developers can define primary or alternative reports, while end-users can save private reports for their individual use. + +1. Navigate to the page finder and select the **Customer - Interactive Report** Page. + + ![App Builder](images/navigate-to-2.png " ") + +2. In the left pane, select **Customer** region and expand the columns. + +3. Click the **Name** column and in the property editor, enter/select the following: + + - Identification > Type: **Link** + + - Under Link: + + - Target: click **No Link Defined** + + - Page: **3** + + - Set Item as follows: + + | Name | Value | + | ---- | ----- | + | P3\_ID | #ID# | + {: title="Set Items"} + + - Clear cache: **3** + + Click **OK**. + + ![App Builder](images/name-link.png " ") + +4. **Save and Run** the page. + + ![App Builder](images/run-app2.png " ") + +5. Click **Actions** and select **Columns**. + + ![App Builder](images/actions1.png " ") + +6. Move the columns **Comments, State, Zip Code** from **Display in Report** region to **Do Not Display** region. There are two ways to do it: + + - Go to the column and double click on the column. + + - Click the column and remove it by clicking the icon Remove (<). + + ![App Builder](images/do-not-display.png " ") + +7. In **Display in Report** region, select the column **Credit Rating**. Click the icon Up **(↑)** to move it up to the second place and click **Apply**. + + ![App Builder](images/credit-rating.png " ") + +8. Click **Actions** and select **Format** > **Control Break**. + + ![App Builder](images/control-break.png " ") + +9. For column, select the column **Region** and click **Apply**. + + ![App Builder](images/control-break-name2.png " ") + +10. To save the primary report, click **Actions** > **Report** > **Save Report**. + + ![App Builder](images/save-report.png " ") + +11. For save, select **As Default Report Settings**. + + ![App Builder](images/as-named-report1.png " ") + +12. For default report type, select **Primary** and click **Apply**. + + ![App Builder](images/primary-apply12.png " ") + +## Task 4: Enhance Navigation Menu + +In this task, you will learn how to manage the navigation menu in an APEX application. By default, an APEX application includes a navigation menu, which can be displayed either on the side or across the top of the application. This menu is customizable, and you also have the option to remove it entirely if desired. + +For this task, you will focus on cleaning up the navigation menu by creating two new entries: one for Customers and another for Orders. Follow the steps outlined below to add these new entries to the navigation menu. + +1. Navigate to **Shared Components**. + + ![App Builder](images/shared-comps2.png " ") + +2. Under **Navigation and Search**, click **Navigation Menu**. + + ![App Builder](images/nav-menu2.png " ") + +3. Click **Navigation Menu**. + + ![App Builder](images/nav-menu3.png " ") + +4. Click **Create Entry**. + + ![App Builder](images/create-entry.png " ") + +5. Enter/select the following: + + - Under Entry: + + - Sequence: **15** + + - Image/Class: **fa-user-circle** + + - List Entry Label: **Customers** + + - Target > Target type: **No Target** + + Click **Create and Create Another**. + + ![App Builder](images/cust-nav.png " ") + +6. Enter/select the following: + + - Under Entry: + + - Sequence: **16** + + - Image/Class: **fa-forms** + + - List Entry Label: **Orders** + + - Target > Target type: **No Target** + + Click **Create List Entry**. + + ![App Builder](images/order-nav.png " ") + +7. Customers and orders entries are created and now you need to define the parent list entry for the rest of the entries. In the desktop navigation menu, go to the Customer and Order options to select the proper parent entry. + +8. Click each customer entries. For **Parent List Entry**, select **Customers** and click **Apply Changes**. + + ![App Builder](images/parent-list.png " ") + + ![App Builder](images/customers-nav.png " ") + +9. Click each order entries. For **Parent List Entry**, select **Orders** and click **Apply Changes**. + + ![App Builder](images/orders-nav.png " ") + +10. The **Orders Form** entry is unnecessary, click on the entry and delete it. + + ![App Builder](images/edit-cust.png " ") + + ![App Builder](images/del-order.png " ") + + ![App Builder](images/del-order-ok.png " ") + +11. Finally, the menu looks cleaner and easy to use. + + ![App Builder](images/menu.png " ") + +## Task 5: Set Authentication Scheme + +In this lab, you will learn how to disable authentication in an APEX application. Authentication is the process of verifying each user's identity before they can access your application. This typically involves entering a username and password, but can also include the use of digital certificates or secure keys. + +Since this application is intended to be public, we will disable the authentication feature. Follow these steps to turn off authentication: + +1. Navigate to **Shared Components**. + + ![App Builder](images/shared-comp3.png " ") + +2. Under **Security**, click **Authentication Schemes**. + + ![App Builder](images/authentication-scheme.png " ") + +3. Click **Create**. + + ![App Builder](images/create-authen.png " ") + +4. For **Create Scheme**, select: **Based on a pre-configured scheme from the gallery** and click **Next**. + + ![App Builder](images/sratch-next.png " ") + +5. Under Name, enter/select the following: + + - Name: **No Authentication** + + - Scheme Type: **No Authentication** + + Click **Create Authentication Scheme**. + + ![App Builder](images/no-authentication.png " ") + +6. Click **No Authentication**. + + ![App Builder](images/click-no-authen.png " ") + +7. Click **Make Current Scheme** and click **OK**. + + ![App Builder](images/make-current-scheme.png " ") + + ![App Builder](images/ok-current-scheme.png " ") + +## Summary + +In this lab, you learned how to enhance various aspects of your APEX app. Building on the business logic analysis from Lab 1, you customized the customer form, faceted search, and interactive report. Additionally, you improved the navigation menu and authentication scheme, and make various UI enhancements. These steps demonstrate how to leverage Oracle APEX to create a more user-friendly and functional application. + +## Acknowledgements + +- **Author** - Monica Godoy, Senior Principal Product Manager ; Ankita Beri, Product Manager; Paolo Paolucci, Data Development Specialist; Victor Mendo, Data Development Specialist +- **Last Updated By/Date** - Ankita Beri, Product Manager, July 2024 diff --git a/forms-to-apex/9-enhance-apex-app/images/Screenshot 2024-07-29.png b/forms-to-apex/9-enhance-apex-app/images/Screenshot 2024-07-29.png new file mode 100644 index 000000000..ca8f6acfa Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/Screenshot 2024-07-29.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/actions.png b/forms-to-apex/9-enhance-apex-app/images/actions.png new file mode 100644 index 000000000..961204444 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/actions.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/actions1.png b/forms-to-apex/9-enhance-apex-app/images/actions1.png new file mode 100644 index 000000000..98c651e4b Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/actions1.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/app-builder1.png b/forms-to-apex/9-enhance-apex-app/images/app-builder1.png new file mode 100644 index 000000000..be06e663e Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/app-builder1.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/as-named-report.png b/forms-to-apex/9-enhance-apex-app/images/as-named-report.png new file mode 100644 index 000000000..bf7e8b7c8 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/as-named-report.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/as-named-report1.png b/forms-to-apex/9-enhance-apex-app/images/as-named-report1.png new file mode 100644 index 000000000..c3bdae301 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/as-named-report1.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/authentication-scheme.png b/forms-to-apex/9-enhance-apex-app/images/authentication-scheme.png new file mode 100644 index 000000000..52b964f4b Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/authentication-scheme.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/city-facet.png b/forms-to-apex/9-enhance-apex-app/images/city-facet.png new file mode 100644 index 000000000..96393707d Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/city-facet.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/click-no-authen.png b/forms-to-apex/9-enhance-apex-app/images/click-no-authen.png new file mode 100644 index 000000000..54f1e9e3e Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/click-no-authen.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/column-mapp.png b/forms-to-apex/9-enhance-apex-app/images/column-mapp.png new file mode 100644 index 000000000..5f735aabf Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/column-mapp.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/constraint.png b/forms-to-apex/9-enhance-apex-app/images/constraint.png new file mode 100644 index 000000000..060d7c73b Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/constraint.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/control-break-name.png b/forms-to-apex/9-enhance-apex-app/images/control-break-name.png new file mode 100644 index 000000000..00dd503d2 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/control-break-name.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/control-break-name1.png b/forms-to-apex/9-enhance-apex-app/images/control-break-name1.png new file mode 100644 index 000000000..c9d12d1e9 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/control-break-name1.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/control-break-name2.png b/forms-to-apex/9-enhance-apex-app/images/control-break-name2.png new file mode 100644 index 000000000..08db9400f Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/control-break-name2.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/control-break.png b/forms-to-apex/9-enhance-apex-app/images/control-break.png new file mode 100644 index 000000000..7606b6dd5 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/control-break.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/control-break1.png b/forms-to-apex/9-enhance-apex-app/images/control-break1.png new file mode 100644 index 000000000..d0410336b Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/control-break1.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/create-authen.png b/forms-to-apex/9-enhance-apex-app/images/create-authen.png new file mode 100644 index 000000000..9b42e23b9 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/create-authen.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/create-entry.png b/forms-to-apex/9-enhance-apex-app/images/create-entry.png new file mode 100644 index 000000000..06962b046 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/create-entry.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/create-facets.png b/forms-to-apex/9-enhance-apex-app/images/create-facets.png new file mode 100644 index 000000000..68cdf9ce9 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/create-facets.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/create-facets1.png b/forms-to-apex/9-enhance-apex-app/images/create-facets1.png new file mode 100644 index 000000000..b06de0a54 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/create-facets1.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/create-lov-pay.png b/forms-to-apex/9-enhance-apex-app/images/create-lov-pay.png new file mode 100644 index 000000000..bb973d64b Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/create-lov-pay.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/create-lov-pay1.png b/forms-to-apex/9-enhance-apex-app/images/create-lov-pay1.png new file mode 100644 index 000000000..0fbc1c5c1 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/create-lov-pay1.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/create-lov.png b/forms-to-apex/9-enhance-apex-app/images/create-lov.png new file mode 100644 index 000000000..9841a370d Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/create-lov.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/create-lov1.png b/forms-to-apex/9-enhance-apex-app/images/create-lov1.png new file mode 100644 index 000000000..42caf1677 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/create-lov1.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/create-product-lov.png b/forms-to-apex/9-enhance-apex-app/images/create-product-lov.png new file mode 100644 index 000000000..ca8f6acfa Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/create-product-lov.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/create-sales-lov.png b/forms-to-apex/9-enhance-apex-app/images/create-sales-lov.png new file mode 100644 index 000000000..6be0250bd Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/create-sales-lov.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/credit-rate-lov.png b/forms-to-apex/9-enhance-apex-app/images/credit-rate-lov.png new file mode 100644 index 000000000..e23fa000c Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/credit-rate-lov.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/credit-rate-radio.png b/forms-to-apex/9-enhance-apex-app/images/credit-rate-radio.png new file mode 100644 index 000000000..c65a5bf3d Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/credit-rate-radio.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/credit-rating.png b/forms-to-apex/9-enhance-apex-app/images/credit-rating.png new file mode 100644 index 000000000..9bf497d27 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/credit-rating.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/credit-rating1.png b/forms-to-apex/9-enhance-apex-app/images/credit-rating1.png new file mode 100644 index 000000000..a7536c31e Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/credit-rating1.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/cust-interactive-report.png b/forms-to-apex/9-enhance-apex-app/images/cust-interactive-report.png new file mode 100644 index 000000000..0500bcdd6 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/cust-interactive-report.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/cust-interactive-report1.png b/forms-to-apex/9-enhance-apex-app/images/cust-interactive-report1.png new file mode 100644 index 000000000..c02a5f4d1 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/cust-interactive-report1.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/cust-nav.png b/forms-to-apex/9-enhance-apex-app/images/cust-nav.png new file mode 100644 index 000000000..47ab75e85 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/cust-nav.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/customers-nav.png b/forms-to-apex/9-enhance-apex-app/images/customers-nav.png new file mode 100644 index 000000000..93a1966f1 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/customers-nav.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/del-order-ok.png b/forms-to-apex/9-enhance-apex-app/images/del-order-ok.png new file mode 100644 index 000000000..aed9b927e Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/del-order-ok.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/del-order.png b/forms-to-apex/9-enhance-apex-app/images/del-order.png new file mode 100644 index 000000000..131affc4f Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/del-order.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/display-return-create.png b/forms-to-apex/9-enhance-apex-app/images/display-return-create.png new file mode 100644 index 000000000..6a23dc8cc Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/display-return-create.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/do-not-display.png b/forms-to-apex/9-enhance-apex-app/images/do-not-display.png new file mode 100644 index 000000000..efb21c829 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/do-not-display.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/do-not-display1.png b/forms-to-apex/9-enhance-apex-app/images/do-not-display1.png new file mode 100644 index 000000000..71b15edb8 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/do-not-display1.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/donot-display.png b/forms-to-apex/9-enhance-apex-app/images/donot-display.png new file mode 100644 index 000000000..fc981c51c Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/donot-display.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/edit-cust.png b/forms-to-apex/9-enhance-apex-app/images/edit-cust.png new file mode 100644 index 000000000..93c68c860 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/edit-cust.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/hidden-address.png b/forms-to-apex/9-enhance-apex-app/images/hidden-address.png new file mode 100644 index 000000000..fdd8ae2e1 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/hidden-address.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/login.png b/forms-to-apex/9-enhance-apex-app/images/login.png new file mode 100644 index 000000000..21d678a34 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/login.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/lov-product.png b/forms-to-apex/9-enhance-apex-app/images/lov-product.png new file mode 100644 index 000000000..a01cb1a6e Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/lov-product.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/lov-product1.png b/forms-to-apex/9-enhance-apex-app/images/lov-product1.png new file mode 100644 index 000000000..cae241beb Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/lov-product1.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/lov-scratch-next.png b/forms-to-apex/9-enhance-apex-app/images/lov-scratch-next.png new file mode 100644 index 000000000..ab14503b6 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/lov-scratch-next.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/lov1.png b/forms-to-apex/9-enhance-apex-app/images/lov1.png new file mode 100644 index 000000000..c9cfbc366 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/lov1.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/make-current-scheme.png b/forms-to-apex/9-enhance-apex-app/images/make-current-scheme.png new file mode 100644 index 000000000..c578374ac Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/make-current-scheme.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/menu.png b/forms-to-apex/9-enhance-apex-app/images/menu.png new file mode 100644 index 000000000..233f45386 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/menu.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/modernization.png b/forms-to-apex/9-enhance-apex-app/images/modernization.png new file mode 100644 index 000000000..32d14bd51 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/modernization.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/name-dynamic-next.png b/forms-to-apex/9-enhance-apex-app/images/name-dynamic-next.png new file mode 100644 index 000000000..f1ff625f5 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/name-dynamic-next.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/name-facet.png b/forms-to-apex/9-enhance-apex-app/images/name-facet.png new file mode 100644 index 000000000..48c8c9d1e Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/name-facet.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/name-link.png b/forms-to-apex/9-enhance-apex-app/images/name-link.png new file mode 100644 index 000000000..481ee868c Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/name-link.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/name-static-next.png b/forms-to-apex/9-enhance-apex-app/images/name-static-next.png new file mode 100644 index 000000000..da424815f Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/name-static-next.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/nav-app-id.png b/forms-to-apex/9-enhance-apex-app/images/nav-app-id.png new file mode 100644 index 000000000..abccbf46b Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/nav-app-id.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/nav-app-id1.png b/forms-to-apex/9-enhance-apex-app/images/nav-app-id1.png new file mode 100644 index 000000000..32aaa60e2 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/nav-app-id1.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/nav-menu2.png b/forms-to-apex/9-enhance-apex-app/images/nav-menu2.png new file mode 100644 index 000000000..2760e9240 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/nav-menu2.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/nav-menu3.png b/forms-to-apex/9-enhance-apex-app/images/nav-menu3.png new file mode 100644 index 000000000..dec026186 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/nav-menu3.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/nav-to-search.png b/forms-to-apex/9-enhance-apex-app/images/nav-to-search.png new file mode 100644 index 000000000..97f360684 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/nav-to-search.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/nav-to-search1.png b/forms-to-apex/9-enhance-apex-app/images/nav-to-search1.png new file mode 100644 index 000000000..228c050f2 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/nav-to-search1.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/navigate-to-2.png b/forms-to-apex/9-enhance-apex-app/images/navigate-to-2.png new file mode 100644 index 000000000..f44d0f8c6 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/navigate-to-2.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/navigation-menu.png b/forms-to-apex/9-enhance-apex-app/images/navigation-menu.png new file mode 100644 index 000000000..1f40b15ed Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/navigation-menu.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/no-authentication.png b/forms-to-apex/9-enhance-apex-app/images/no-authentication.png new file mode 100644 index 000000000..e35f8bb1a Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/no-authentication.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/ok-current-scheme.png b/forms-to-apex/9-enhance-apex-app/images/ok-current-scheme.png new file mode 100644 index 000000000..2bc30bebe Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/ok-current-scheme.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/order-nav.png b/forms-to-apex/9-enhance-apex-app/images/order-nav.png new file mode 100644 index 000000000..bdf4f79b5 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/order-nav.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/orders-nav.png b/forms-to-apex/9-enhance-apex-app/images/orders-nav.png new file mode 100644 index 000000000..d8fb71f60 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/orders-nav.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/parent-list.png b/forms-to-apex/9-enhance-apex-app/images/parent-list.png new file mode 100644 index 000000000..c71523ab8 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/parent-list.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/prim-apply.png b/forms-to-apex/9-enhance-apex-app/images/prim-apply.png new file mode 100644 index 000000000..b9a4fbbdb Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/prim-apply.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/primary-apply.png b/forms-to-apex/9-enhance-apex-app/images/primary-apply.png new file mode 100644 index 000000000..9b1b28794 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/primary-apply.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/primary-apply1.png b/forms-to-apex/9-enhance-apex-app/images/primary-apply1.png new file mode 100644 index 000000000..7f24b974b Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/primary-apply1.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/primary-apply12.png b/forms-to-apex/9-enhance-apex-app/images/primary-apply12.png new file mode 100644 index 000000000..62fcef361 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/primary-apply12.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/product-next.png b/forms-to-apex/9-enhance-apex-app/images/product-next.png new file mode 100644 index 000000000..0cfa2e552 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/product-next.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/run-app2.png b/forms-to-apex/9-enhance-apex-app/images/run-app2.png new file mode 100644 index 000000000..e7c68fb37 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/run-app2.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/sales-rep-lov.png b/forms-to-apex/9-enhance-apex-app/images/sales-rep-lov.png new file mode 100644 index 000000000..24f698f52 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/sales-rep-lov.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/sales-rep-lov1.png b/forms-to-apex/9-enhance-apex-app/images/sales-rep-lov1.png new file mode 100644 index 000000000..6156c5482 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/sales-rep-lov1.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/save-report.png b/forms-to-apex/9-enhance-apex-app/images/save-report.png new file mode 100644 index 000000000..99787b075 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/save-report.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/save-report1.png b/forms-to-apex/9-enhance-apex-app/images/save-report1.png new file mode 100644 index 000000000..b695ee55e Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/save-report1.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/save-report11.png b/forms-to-apex/9-enhance-apex-app/images/save-report11.png new file mode 100644 index 000000000..d7baf00dd Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/save-report11.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/scratch-lov.png b/forms-to-apex/9-enhance-apex-app/images/scratch-lov.png new file mode 100644 index 000000000..35e282106 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/scratch-lov.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/select-cust.png b/forms-to-apex/9-enhance-apex-app/images/select-cust.png new file mode 100644 index 000000000..f06027c0f Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/select-cust.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/select-cust1.png b/forms-to-apex/9-enhance-apex-app/images/select-cust1.png new file mode 100644 index 000000000..081c6ea7f Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/select-cust1.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/sequence-items.png b/forms-to-apex/9-enhance-apex-app/images/sequence-items.png new file mode 100644 index 000000000..23f78a900 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/sequence-items.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/sequence.png b/forms-to-apex/9-enhance-apex-app/images/sequence.png new file mode 100644 index 000000000..4afd31cb6 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/sequence.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/shared-comp3.png b/forms-to-apex/9-enhance-apex-app/images/shared-comp3.png new file mode 100644 index 000000000..0c1d6a4fc Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/shared-comp3.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/shared-comps.png b/forms-to-apex/9-enhance-apex-app/images/shared-comps.png new file mode 100644 index 000000000..3907dae05 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/shared-comps.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/shared-comps2.png b/forms-to-apex/9-enhance-apex-app/images/shared-comps2.png new file mode 100644 index 000000000..df2536181 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/shared-comps2.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/sql-query.png b/forms-to-apex/9-enhance-apex-app/images/sql-query.png new file mode 100644 index 000000000..b49d83809 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/sql-query.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/sql-query1.png b/forms-to-apex/9-enhance-apex-app/images/sql-query1.png new file mode 100644 index 000000000..d79500afc Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/sql-query1.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/sratch-next.png b/forms-to-apex/9-enhance-apex-app/images/sratch-next.png new file mode 100644 index 000000000..9654bff74 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/sratch-next.png differ diff --git a/forms-to-apex/9-enhance-apex-app/images/values-lov.png b/forms-to-apex/9-enhance-apex-app/images/values-lov.png new file mode 100644 index 000000000..5d5942795 Binary files /dev/null and b/forms-to-apex/9-enhance-apex-app/images/values-lov.png differ diff --git a/forms-to-apex/intro/images/menu-button.png b/forms-to-apex/intro/images/menu-button.png new file mode 100644 index 000000000..1716bedbc Binary files /dev/null and b/forms-to-apex/intro/images/menu-button.png differ diff --git a/forms-to-apex/intro/introduction.md b/forms-to-apex/intro/introduction.md new file mode 100644 index 000000000..93a075081 --- /dev/null +++ b/forms-to-apex/intro/introduction.md @@ -0,0 +1,42 @@ +# Introduction + +## About this Workshop + +Welcome to our Oracle Forms to Oracle APEX Transition Workshop! This hands-on workshop will equip you with the knowledge and skills to modernize your legacy Oracle Forms applications using Oracle APEX. Whether you are new to APEX or looking to refine your skills, this workshop will provide valuable insights and practical experience. Throughout the workshop, you will learn to understand the fundamental differences and similarities between Oracle Forms and APEX and how to map components from one to the other. + +You will also analyze and extract crucial business logic from your existing Oracle Forms applications, set up the necessary database infrastructure to support your APEX applications and use the Create Application Wizard to develop a web-based application. Additionally, you will learn best practices and advanced techniques to enhance your APEX applications' functionality and user experience. + +By the end of this workshop, you will be well-prepared to transform your Oracle Forms applications into powerful, user-friendly APEX applications, leveraging modern web technologies to enhance performance and usability. Join us as we explore the exciting possibilities of APEX and take your applications to the next level! + +Estimated Time: 1 hour + +### Objectives + +In this workshop, you: + +- Understand Oracle Forms and Oracle APEX. +- Analyze and Extract Business Logic. +- Implement Oracle Forms functionalities using APEX. + +*Note: This workshop assumes you are using Oracle APEX 24.1. Some of the features might not be available in prior releases and the instructions, flow, and screenshots might differ if you use an older version of Oracle APEX.* + +### **Let's Get Started!** + +If the menu is not displayed, you can open by clicking the menu button (![Menu icon](images/menu-button.png)) at the upper-left corner of the page. + +### Downloads + +[Click here](https://c4u04.objectstorage.us-ashburn-1.oci.customer-oci.com/p/EcTjWk2IuZPZeNnD_fYMcgUhdNDIDA6rt9gaFj_WZMiL7VvxPBNMY60837hu5hga/n/c4u04/b/livelabsfiles/o/labfiles/forms-modernization-export.sql) to download the completed application. + +## Learn More + +- [APEX on Autonomous](https://apex.oracle.com/autonomous) +- [APEX Collateral](https://www.oracle.com/database/technologies/appdev/apex/collateral.html) +- [Tutorials](https://apex.oracle.com/en/learn/tutorials) +- [Community](https://apex.oracle.com/community) +- [External Site + Slack](http://apex.world) + +## **Acknowledgements** + +- **Author** - Monica Godoy, Senior Principal Product Manager ; Ankita Beri, Product Manager; Paolo Paolucci, Data Development Specialist; Victor Mendo, Data Development Specialist +- **Last Updated By/Date** - Ankita Beri, Product Manager, July 2024 diff --git a/forms-to-apex/workshops/tenancy/index.html b/forms-to-apex/workshops/tenancy/index.html new file mode 100644 index 000000000..aaac634be --- /dev/null +++ b/forms-to-apex/workshops/tenancy/index.html @@ -0,0 +1,62 @@ + + + + + + + + + Oracle LiveLabs + + + + + + + + + + + + +
+
+
+
+
+
+
+
+ + + + + diff --git a/forms-to-apex/workshops/tenancy/manifest.json b/forms-to-apex/workshops/tenancy/manifest.json new file mode 100644 index 000000000..0e177ec3d --- /dev/null +++ b/forms-to-apex/workshops/tenancy/manifest.json @@ -0,0 +1,54 @@ +{ + "workshoptitle": "Modernization of Oracle Forms to Oracle APEX", + "tutorials": [ + { + "title": "Introduction", + "filename": "../../intro/introduction.md" + }, + { + "title": "Get Started", + "filename": "../../../common-241/1-sign-up-apex/1-sign-up-apex.md" + }, + { + "title": "Lab 1: Analyze the sample Forms [Study] ", + "filename": "../../1-analyze-sample-forms/analyze.md" + }, + { + "title": "Lab 2: Map Oracle Forms components to APEX [Study] ", + "filename": "../../2-mapping-forms-to-apex/2-mapping-forms-to-apex.md" + }, + { + "title": "Lab 3: Setup the Database objects ", + "filename": "../../3-setup-database-objects/3-setup-database-objects.md" + }, + { + "title": "Lab 4: Create the APEX Application", + "filename": "../../4-create-apex-app/4-create-apex-app.md" + }, + { + "title": "Lab 5: Configure List of Values", + "filename": "../../5-configure-list-values/5-configure-list-values.md" + }, + { + "title": "Lab 6: Create the Items Form", + "filename": "../../6-item-form/6-item-form.md" + }, + { + "title": "Lab 7: Enhance Order Faceted Search Page", + "filename": "../../7-enhance-order-faceted/7-enhance-order-faceted.md" + }, + { + "title": "Lab 8: Enhance Order Form Page", + "filename": "../../8-enhance-order-form/8-enhance-order-faceted.md" + }, + { + "title": "Lab 9: Enhance Your APEX App", + "filename": "../../9-enhance-apex-app/9-enhance-apex-app.md" + }, + { + "title": "Need Help?", + "description": "Solutions to Common Problems and Directions for Receiving Live Help", + "filename":"https://oracle-livelabs.github.io/common/labs/need-help/need-help-freetier.md" + } + ] +} diff --git a/oci-document-understanding/1-configure-oci-keys/1-configure-oci-keys.md b/oci-document-understanding/1-configure-oci-keys/1-configure-oci-keys.md index 1c32920f7..c74a23fbc 100644 --- a/oci-document-understanding/1-configure-oci-keys/1-configure-oci-keys.md +++ b/oci-document-understanding/1-configure-oci-keys/1-configure-oci-keys.md @@ -2,7 +2,7 @@ ## Introduction -In this lab, you learn how to configure the OCI API keys and Create Buckets in OCI Object Storage. In Oracle Cloud Infrastructure (OCI), API keys are used for secure authentication when accessing OCI resources through REST APIs, and a bucket refers to a logical container used to store and manage data objects within an Object Storage service. +In this lab, you learn how to configure the OCI API keys and create buckets in OCI object storage. In Oracle Cloud Infrastructure (OCI), API keys are used for secure authentication when accessing OCI resources through REST APIs, and a bucket refers to a logical container used to store and manage data objects within an Object Storage service. OCI API keys have two parts: a **Public key** and a **Private key**. You use the OCI console to generate the Private/Public key pair. @@ -46,17 +46,18 @@ To Generate the API Keys using OCI Console: ![Profile Menu](images/configuration-preview.png " ") ## Task 2: Create a Bucket in OCI Object Storage + To create a Bucket using OCI Console, login to your OCI Account. 1. To access the Object Storage service, click on the menu icon **(☰)** at the top-left corner. ![Navigate to storage](images/navigate-to-storage.png " ") -2. Under Storage, Select **Buckets**. +2. Under Storage, select **Buckets**. ![Select Bucket](images/select-bucket.png " ") -3. Select the compartment where you want to create the Bucket. You can choose an existing compartment or create a new one if needed. Now, Select **Create Bucket**. +3. Select the compartment where you want to create the Bucket. You can choose an existing compartment or create a new one if needed. Now, select **Create Bucket**. ![Select Bucket](images/create-bucket.png " ") diff --git a/oci-document-understanding/2-install-scripts/2-install-scripts.md b/oci-document-understanding/2-install-scripts/2-install-scripts.md index d09ef0b74..ba035cd00 100644 --- a/oci-document-understanding/2-install-scripts/2-install-scripts.md +++ b/oci-document-understanding/2-install-scripts/2-install-scripts.md @@ -20,7 +20,7 @@ In this lab, you: ## Task 1: Create database objects using SQL Scripts -1. Login into your APEX Workspace. Click **'⌄'** next to **SQL Workshop** and Select **SQL Scripts**. +1. Log in into your APEX Workspace. Click **'⌄'** next to **SQL Workshop** and Select **SQL Scripts**. ![Select Quick SQL](images/sql_script.png " ") @@ -209,7 +209,7 @@ In this lab, you:
``` -4. For **Script Name**: Enter **Application Scripts** and Click **Run**. +4. For **Script Name**: Enter **Application Scripts** and click **Run**. ![Script Name](./images/script-name.png " ") diff --git a/oci-document-understanding/3-create-application/3-create-application.md b/oci-document-understanding/3-create-application/3-create-application.md index 34e41659c..5e533fb41 100644 --- a/oci-document-understanding/3-create-application/3-create-application.md +++ b/oci-document-understanding/3-create-application/3-create-application.md @@ -1,8 +1,8 @@ -# Integrate OCI Document Understanding with Oracle APEX +# Invoke OCI Doc Understanding using REST Data Sources ## Introduction -In this lab, you create an APEX application named **Automatic Invoice Handling** using the Create App Wizard. You also set up a REST Data Source to interact with OCI Doucment Understanding and enhance the home page to facilitate invoice uploading and document processing and analysis. +In this lab, you create an APEX application named **Automatic Invoice Handling** using the Create App Wizard. You also set up a REST Data Source to interact with OCI Document Understanding and enhance the home page to facilitate invoice uploading and document processing and analysis. OCI Doc Understanding refers to Oracle Cloud Infrastructure's (OCI) service for document processing and analysis. It enables users to extract valuable insights and metadata from unstructured documents such as PDFs, images, and scanned documents. @@ -13,14 +13,14 @@ Estimated Time: 10 Minutes In this lab, you: - Create an Application -- Invoke OCI Doc Understanding using REST Data Source +- Invoke OCI Document Understanding using REST Data Sources - Enhance Home Page to Upload Invoices and Process the document - Create Processes to upload Invoice to Object Storage and Automate DML - Integrate Document Understanding API and Parse the Response ## Task 1: Create an Application -1. On the workspace home page, Select **App Builder**. +1. On the workspace home page, select **App Builder**. ![Click App Builder](images/app-build6.png " ") @@ -32,15 +32,15 @@ In this lab, you: ![Use Create App Wizard](images/use-create-app-wizard.png " ") -4. Before Name, Select **Set Icon**. +4. Before Name, select **Set Icon**. ![Set Icon](images/set-icon.png " ") -5. In the Choose Application Icon dialog, Select any Color and icon, then click **Save Icon**. +5. In the Choose Application Icon dialog, select any color and icon, then click **Save Icon**. ![Save Icon](images/save-icon.png " ") -6. Next to **Name**, Select **Set Appearance** icon. +6. Next to **Name**, select **Set Appearance** icon. ![Set Appearance](images/set-appearance.png " ") @@ -134,7 +134,7 @@ In this lab, you: ``` - Click **Synchronize with Body** and then Click **OK**. + Click **Synchronize with Body** and then click **OK**. ![edit post](images/edit-post.png " ") @@ -142,7 +142,7 @@ In this lab, you: ![Synchronize with Body Ok](images/synchronize-ok.png " ") -11. Under **Operation Parameters**, Click **Add Parameter**. +11. Under **Operation Parameters**, click **Add Parameter**. ![Click Add Parameter](images/add-parameter.png " ") @@ -172,11 +172,11 @@ In this lab, you: ![1-Home](images/home-page.png " ") -3. Under **Breadcrumb bar**, Select **Automatic Invoice Handling** and update Name: **Process Your Invoice**. +3. Under **Breadcrumb Bar**, select **Automatic Invoice Handling** and update Name: **Process Your Invoice**. ![Breadcrumb bar](images/breadcrum-bar.png " ") -4. Right-click **Body** and Select **Create Region**. +4. Right-click **Body** and select **Create Region**. ![Create Region](images/create-region.png " ") @@ -196,11 +196,11 @@ In this lab, you: ![hidden items](images/all-hidden.png " ") -7. Right-click **Upload Your Invoice** region and select **Create Page item**. +7. Right-click **Upload Your Invoice** region and select **Create Page Item**. ![hidden items](images/create-page-item.png " ") -8. Now, add the following Eight page items one after the other: +8. Now, add the following eight page items one after the other: | | Identification > Name | Identification > Type | Default > Type | Default > Static | Session State > Datatype | |---|-------|------|----------| --------------| ------ | @@ -218,7 +218,7 @@ In this lab, you: ![hidden items](images/response-item.png " ") -9. Under **Upload your Invoice** region, Right-click **P1\_ID** and select **Create Page Item Below**. +9. Under **Upload your Invoice** region, right-click **P1\_ID** and select **Create Page Item Below**. ![hidden items](images/create-page-item-below.png " ") @@ -268,7 +268,7 @@ In this lab, you: ![create-button](images/btn-details.png " ") -14. In the Processing tab, right-click **Processing** and Select **Create Process**. +14. In the Processing tab, right-click **Processing** and select **Create Process**. ![create process](images/create-process6.png " ") diff --git a/oci-document-understanding/4-additional-pages/4-additional-pages.md b/oci-document-understanding/4-additional-pages/4-additional-pages.md index 73ae42f5b..8151098cf 100644 --- a/oci-document-understanding/4-additional-pages/4-additional-pages.md +++ b/oci-document-understanding/4-additional-pages/4-additional-pages.md @@ -68,7 +68,7 @@ In this task, you create an application process to retrieve the URL and MIME typ OWA_UTIL.HTTP_HEADER_CLOSE; WPG_DOCLOAD.DOWNLOAD_FILE(L_BLOB); END; - + ``` Click **Next**. @@ -166,7 +166,7 @@ In this task, you create an Invoice Tracking page featuring the Cards Region, wh ![Invoice Tracker attributes](images/invoice-tracker-attributes.png " ") -7. In the property editor, select the **Region** tab. Under **Source**, Select **Order By Item** and Enter/select the following: +7. In the property editor, select the **Region** tab. Under **Source**, select **Order By Item** and enter/select the following: | Clause | Key | Display | |--------|-----|---------| @@ -191,7 +191,7 @@ In this task, you create an Invoice Analysis page featuring the Cards Region. Th ![Select Blank Page](images/blank-page1.png " ") -3. On the Create Page dialog, Enter/select the following: +3. On the Create Page dialog, enter/select the following: - Page Definition > Page Number: **3** @@ -205,7 +205,7 @@ In this task, you create an Invoice Analysis page featuring the Cards Region. Th ![Invoice Analysis](images/create-blank-page11.png " ") -4. In the left Pane, Right-click Body, and select **Create Page Item**. +4. In the left Pane, right-click **Body**, and select **Create Page Item**. ![Create Page Item](images/create-page-item3.png " ") @@ -221,7 +221,7 @@ In this task, you create an Invoice Analysis page featuring the Cards Region. Th ![Page Item URL](images/page-item-url.png " ") -6. Under **Pre-Rendering**, Right-Click **Before Header** and select **Create Process**. +6. Under **Pre-Rendering**, right-click **Before Header** and select **Create Process**. ![Create Process](images/create-before-header.png " ") @@ -234,18 +234,16 @@ In this task, you create an Invoice Analysis page featuring the Cards Region. Th ``` :P3_URL := APEX_PAGE.GET_URL(P_PAGE => 3,P_REQUEST => 'APPLICATION_PROCESS=DISPLAY_PDF', P_PLAIN_URL => TRUE); - - :P3_URL := APEX_PAGE.GET_URL(P_PAGE => 3, P_REQUEST => 'APPLICATION_PROCESS=DISPLAY_PDF', P_PLAIN_URL => TRUE); ``` ![Preapare URL](images/prepare-url1.png " ") -8. In the left Pane, Right-click **Body** and Select **Create Region**. +8. In the left pane, right-click **Body** and select **Create Region**. ![Create Region](images/create-region4.png " ") -9. In the Property Editor, Enter/select the following details: +9. In the property editor, enter/select the following details: - Indentification > Name: **Uploaded File** @@ -254,14 +252,14 @@ In this task, you create an Invoice Analysis page featuring the Cards Region. Th ```

- +

``` ![Upload File](images/uploaded-file.png " ") -10. Right-Click **Uploaded File** region, select **Create Region Below**. +10. Right-click **Uploaded File** region, select **Create Region Below**. ![Create Region Below](images/create-region-below.png " ") @@ -323,11 +321,11 @@ In this task, you create an Invoice Analysis page featuring the Cards Region. Th ![Page 2: Invoice Tracker](images/navigate-to-2.png " ") -15. Under **Invoice Tracker** region, Right-click **Actions** and select **Create Action**. +15. Under **Invoice Tracker** region, right-click **Actions** and select **Create Action**. ![Create Action](images/creation-action2.png " ") -16. In the Property Editor, Enter/select the following details: +16. In the property editor, enter/select the following details: - Identification > Type: **Full Card** @@ -343,15 +341,15 @@ In this task, you create an Invoice Analysis page featuring the Cards Region. Th 17. Click **Save**. -18. In the Page Designer toolbar, select **Page Selector** and Navigate to **Page 1: Home**. +18. In the Page Designer toolbar, select **Page Selector** and navigate to **Page 1: Home**. ![Page 1: Home](images/navigate-to-home.png " ") -19. Under **Processing**, Right-click **After Processing** and select **Create Branch**. +19. Under **Processing**, right-click **After Processing** and select **Create Branch**. ![Create Branch](images/create-branch.png " ") -20. In the Property Editor, Enter/select the following details: +20. In the property editor, enter/select the following details: - Identification > Name: **Redirect to Page 2** diff --git a/oci-document-understanding/5-approval-comp/5-approval-comp.md b/oci-document-understanding/5-approval-comp/5-approval-comp.md index 3e2280b97..8caf88996 100644 --- a/oci-document-understanding/5-approval-comp/5-approval-comp.md +++ b/oci-document-understanding/5-approval-comp/5-approval-comp.md @@ -20,7 +20,7 @@ In this lab, you: ![Task Definition in Shared Components](images/sc-8.png " ") -2. Under **Workflows and Automations**, Select **Task Definitions**. +2. Under **Workflows and Automations**, select **Task Definitions**. ![Select Task Definition](images/task-def.png " ") @@ -52,7 +52,7 @@ In this lab, you: - Actions Source: **SQL Query**. - - Actions SQL query: Copy the code below and paste it into the code editor: + - Actions SQL Query: Copy the code below and paste it into the code editor: ``` @@ -70,7 +70,7 @@ In this lab, you: ![Task Definition Settings](images/action-source.png " ") -7. Under **Participants**, Click **Add Row** and Enter/select the following: +7. Under **Participants**, click **Add Row** and enter/select the following: - Participant Type: **Potential Owner** @@ -105,7 +105,7 @@ In this lab, you: ![Task Definition Participants](images/participants.png " ") -8. Under **Parameters**, Click **Add Row** and enter the three parameters one after the other: +8. Under **Parameters**, click **Add Row** and enter the three parameters one after the other: | Static ID | Label | Data Type | --- | --- | --- | @@ -122,7 +122,7 @@ In this lab, you: ![Click on Expense Request](images/invoice-req-app1.png " ") -14. Under **Actions**, Click **Add Action**. +14. Under **Actions**, click **Add Action**. ![Click on Expense Request](images/add-action.png " ") @@ -171,7 +171,7 @@ In this lab, you: ![Home - 1](./images/home1.png " ") -3. In the left pane, under **Pre-Rendering**, Right-click **Before Header** and click **Create Process**. +3. In the left pane, under **Pre-Rendering**, right-click **Before Header** and click **Create Process**. ![Create Process](./images/create-process3.png " ") @@ -197,11 +197,11 @@ In this lab, you: ![Create Process](./images/fetch-emp-details.png " ") -5. Navigate to **Processing** tab, Right-click **Processing** and select **Create Process**. +5. Navigate to **Processing** tab, right-click **Processing** and select **Create Process**. ![Create Process](./images/create-process4.png " ") -6. In the property editor, Enter/select the following details: +6. In the property editor, enter/select the following details: - Under Identification: @@ -234,11 +234,11 @@ In this lab, you: ## Task 3: Create Unified Task Lists -1. On Page Designer toolbar, Navigate to **Create(+ v)** and select **Page**. +1. On Page Designer toolbar, navigate to **Create(+ v)** and select **Page**. ![Click Application ID](./images/page3.png " ") -2. Under Components, Select **Unified Task List**. +2. Under Components, select **Unified Task List**. ![Select Unified Task List](./images/unified-task-list.png " ") @@ -258,11 +258,11 @@ In this lab, you: ![Click Create Page](./images/initiated-by-me.png " ") -4. In Page Designer toolbar, Navigate to **Create(+)** and select **Page**. +4. In Page Designer toolbar, navigate to **Create(+)** and select **Page**. ![Click Create Page](./images/page4.png " ") -5. Under Components, Select **Unified Task List**. +5. Under Components, select **Unified Task List**. ![Select Unified Task List](./images/unified-task-list.png " ") @@ -282,11 +282,11 @@ In this lab, you: ![Select Unified Task List](./images/my-approvals.png " ") -7. On the Page Designer toolbar, Navigate to your **Task Details** Page. +7. On the Page Designer toolbar, navigate to your **Task Details** Page. ![Select Unified Task List](./images/navigate-to-task-details.png " ") -8. Under the **Page Rendering** tab, Select **Details** region and update the following: +8. Under the **Page Rendering** tab, select **Details** region and update the following: - Source > SQL Query: Copy and replace the below code into the code editor: @@ -307,7 +307,7 @@ In this lab, you: ![Select Unified Task List](./images/details.png " ") -9. Under **Details** region, Select **LINK_TO** column and update the following: +9. Under **Details** region, select **LINK_TO** column and update the following: - Identification > Type: **LINK** diff --git a/oci-document-understanding/intro/introduction.md b/oci-document-understanding/intro/introduction.md index db32a932a..5a97cc5b0 100644 --- a/oci-document-understanding/intro/introduction.md +++ b/oci-document-understanding/intro/introduction.md @@ -40,9 +40,9 @@ In this workshop, you: ## Downloads -If you are stuck or the App is not working as expected, you can download and install the completed App as follows: +If you are stuck or the app is not working as expected, you can download and install the completed App as follows: -1. [Click here](https://c4u04.objectstorage.us-ashburn-1.oci.customer-oci.com/p/EcTjWk2IuZPZeNnD_fYMcgUhdNDIDA6rt9gaFj_WZMiL7VvxPBNMY60837hu5hga/n/c4u04/b/livelabsfiles/o/labfiles/automate-invoice-handling-export.sql) to download the completed application zip file and unzip it. +1. [Click here](https://c4u04.objectstorage.us-ashburn-1.oci.customer-oci.com/p/EcTjWk2IuZPZeNnD_fYMcgUhdNDIDA6rt9gaFj_WZMiL7VvxPBNMY60837hu5hga/n/c4u04/b/livelabsfiles/o/labfiles/automate-invoice-handling-export.sql) to download the completed application. 2. Import the **automate-invoice-handling-export.sql** file into your workspace. Follow the steps in the Install Application wizard to install the app along with the Supporting Objects.