From the Windows Start menu, select Programs | Oracle Developer Suite iDS10g | Forms Developer | Start OC4J Instance.

You can minimize the command prompt window when the window displays the message "Oracle Application Server Containers for J2EE 10g (9.0.4.0.0) initialized".

Note: Do not close the OC4J Instance window. When you want to stop OC4J, choose Programs | Oracle Developer Suite iDS10g | Forms Developer | Stop OC4J Instance from the Windows Start menu.

From the Windows Start menu, select Programs | Oracle Developer Suite iDS10g | Forms Developer | Forms Builder.

When Forms Builder starts, an empty form is automatically created named Module1. Select the Module1 name, then click it again to change the name of the form. Type in the name HR and press Enter.

Click Save . By default, Forms saves files in the \bin directory of your Developer Suite installation. You may want to save it in a different directory; if desired, you can create a new directory called MyForms in which to save the application.

Connect to the database as the HR user by clicking Connect and then entering the userid, password, and connect string for the database that contains the HR or HR8 schema (see Prerequisites).

Select the Data Blocks node in the Object Navigator, then click Create .

In the New Data Block dialog, ensure that Use the Data Block Wizard is selected, then click OK.

If the Welcome to the Data Block Wizard page displays, click Next >.

You can base a data block on a database table or view, or on a set of stored procedures in which you can define complicated query, insert, update, and delete logic. For this application you base the block on a table, so ensure that Table or View is selected, then click Next >.

In the Table or view field, type departments for the table name, then click Refresh. Click the right double arrow button to move all available columns to the Database Items to be included in the block, then click Next >.

Accept the default name for the block, which is the same as the table name, and click Next >.

On the final page of the Data Block Wizard, click Finish to create the data block and invoke the Layout Wizard.

If the Welcome to the Layout Wizard page displays, click Next >.

Accept the defaults and click Next > to lay out the items on a new content canvas.

Note: A content canvas is one that fills the entire window. You can display only one content canvas at a time within a window. Other canvas types are toolbar, stacked, and tab canvases, which typically reside in a portion of a window while the content canvas remains at least partially visible.

You decide to display only the department id and department name, because the location id and manager id are just numbers that are not meaningful to the user.

Control-click DEPARTMENT_ID and DEPARTMENT_NAME in the Available Items list, then click the right single arrow button to move them to the Displayed Items list.

Click Next >.

Click Next > to accept the default item prompt, width, and height for both items.

Click Next > to accept the Form layout.

For the Frame Title enter Department, then click Next >.

On the final page of the Layout Wizard, click Finish to create the canvas and open it in the Layout Editor.

In the Layout Editor, you can perform any cosmetic changes that you want to the layout.

First, to ensure that changes to the layout frame are preserved, double-click the frame (the line that surrounds the items) to invoke its Property Palette.

Note: You can leave the Property Palette open; it displays the properties for whatever object is currently selected. If you should close the Property Palette, you can reopen it by selecting Tools | Property Palette from the Forms Builder menu. Alternatively, double-clicking most Forms objects opens the Property Palette for that object.

In the Property Palette for the Frame, change the property Update Layout from Automatically to Manually.

Enlarge the frame by clicking the handle in its lower right corner and dragging it downward and to the right.

Click the Rounded Rectangle tool on the toolbar at the left of the Layout Editor. With the mouse, click and drag a rectangle around the department id and the department name.

With the rectangle selected in the Layout Editor, click Fill Color on the Layout Editor toolbar and pick a color for the rectangle. (You may need to click the arrow at the bottom of the toolbar to scroll down to the Fill Color button if the Layout Editor window is too small to display all the tools.)

In the Layout Editor, click the Display Item tool . Click a point on the canvas just below the department name to create a Display Item. Then click the Display Item tool again, and click a point on the canvas just below the display item that you just created.

Note: A Display Item is similar to a Text Item (used for Department_Id and Department_Name), except that it does not accept user input. If you want users to be able to change these values, you should use a Text Item.

Control-click each of the Display Items to select them both. Alternatively, you can drag the mouse around both items to select them, being careful to include only those two items.

The Property Palette should now display the properties for both display items. If both display items have the same value for a property, the value is displayed. If the two display items have different values for a property, asterisks are displayed for that property.

Selecting both display items enables you to change properties to identical values for both items .

Change the following properties in the Property Palette for both display items:

Hint: If you have trouble locating a particular property, type its name in the Find box at the top right of the Property Palette. As soon as you have typed enough letters to uniquely identify the property, Forms Builder highlights that property in the Property Palette.

Change the following properties for only the first display item by selecting it singly (click an area outside the two display items to deselect them, then click the first display item):

Change the following properties for the second display item only:

Move the second Display Item up slightly so it is just under the first. An easy way to move an item a short distance is to select it and then use the arrow keys to nudge the item to its desired position.

To ensure that all items are properly aligned, select all items (do not include the prompts in this selection) and click Align Left on the Layout Editor toolbar.

In the Layout Editor, click into the item prompts Department Name and Department Id. Delete the word "Department" from both prompts. Alternatively, you can change the item prompts in the Property Palette for each item.

Click Save to save the form, then click Run Form to test it (be sure that you have started OC4J -- see Step 1).

When the form starts running, click Execute Query to display data in the form. Click Next Record and Previous Record to navigate between records.

Note: At this point the Location and Manager items are not populated; you write code to populate these items in a later step.

Click Exit Form to exit the application, then close the browser window.

CAUTION: Always exit the application by clicking the Exit Form button prior to closing the browser. Failure to do this may cause the Runform process to hang; if this happens, you need to open Task Manager and end the ifweb90.exe process.

Select Departments in the Object Navigator, then click Create . This ensures that the new block immediately follows Departments in the Object Navigator tree. The sequence of the blocks determines default navigation and also the sequence of commit processing.

Note: If you happen to create an object in the wrong order, you can drag its icon to the desired position in the Object Navigator. For example, if the sequence of the blocks is Employees, then Departments, you can drag the Employees block icon to a position after Departments under the Data Blocks node.

In the New Data Block dialog, ensure that Use the Data Block Wizard is selected, then click OK.

If the Welcome to the Data Block Wizard page displays, click Next >.

You are basing the block on a table, so ensure that Table or View is selected, then click Next >.

In the Table or view field, type employees for the table name, then click Refresh. Click the right double arrow button to move all available columns to the Database Items to be included in the block, then click
Next >.

Because there is already a block in the form, you are offered the option to relate this new block to it. Click Create Relationship.... A dialog displays any foreign keys defined in the database between these two tables. Click OK to base the relationship between the blocks on the EMP_DEPT_FK foreign key.

Click Next > to accept the join condition created automatically by Forms Builder based on the foreign key, then on the next screen click Next >, and then Finish.

If the Welcome to the Layout Wizard page displays, click Next >.

Click Next > to accept the default of laying out the items on the existing canvas.

In the Available Items column, select for display all items except Manager_Id and Department_Id, and then click the single right arrow button to move them to the Displayed Items column.

Change the following item prompts:

Click Next >.

You want to display several employees at a time in a tabular format, so select the Tabular option and click Next >.

For the Frame Title, type Employees. Change Records Displayed to 5. Check Display Scrollbar, then click Next >, and on the final screen, click Finish.

The Layout Editor opens showing how five employee records are displayed. If you maximize the Layout Editor window, you can see that the canvas has been enlarged to accommodate all the items, but the viewport, which is the area that shows data in the running form, does not show the entire record.

Note: Although in this case you could enlarge the viewport so that the entire record is visible, for this exercise you use a different technique that shows you one way to make it possible for users to view more data than can display in a single window.

Restore the Layout Editor window to its original size. Observe that the Object Navigator shows that a relation, some triggers, and some program units have been automatically created. These are for master-detail coordination.

Click Save to save the form, then click Run Form to test it (be sure that you have started OC4J -- see Step 1).

When the form starts running, click Execute Query to display data in the form. Click Next Record . Notice that the form automatically displays employees associated with the next department record. Click Next Block to navigate to the Employees block. You must tab through the items to be able to see them all.

In the next step, you see one technique to better display data that does not fit in a single window.

Click Exit Form to exit the application, then close the browser window.

Select the canvas in the Object Navigator and click Create .

Change the names of both canvases by clicking the name in the Object Navigator, then clicking again and overtyping the existing name. Call the original canvas MAIN_CV and the new canvas EMP_DETAILS_CV.

Note: Alternatively you could change the name in the Property Palette.

Open the MAIN_CV canvas in the Layout Editor. In the Employees block, control-click (or drag the mouse) to select the Email, Phone_Number, Hire_Date, Salary, and Commission_Pct items. Choose Edit | Cut from the menu.

Select the EMP_DETAILS_CV canvas from the Canvas pop-up list at the top left of the Layout Editor and select EMPLOYEES from the Block pop-up list. Choose Edit | Paste from the menu. Drag the items to a location near the upper left corner of the canvas.

With all items still selected, open the Property Palette and change the following properties:

Then drag the items to arrange them on the canvas, leaving some room at the top for the synchronized items that you create next.

Change the background color of the canvas. Click a blank spot on the canvas so that the Property Palette displays the canvas properties. Change the Background Color property to a color of your choosing.

Select MAIN_CV from the Canvas pop-up list of the Layout Editor. Select together the Employee_Id, First_Name, and Last_Name items. From the menu, choose Edit | Copy.

Select EMP_DETAILS_CV from the Canvas pop-up list of the Layout Editor. From the menu, choose Edit | Paste.

Change the property values as you did in step 5-5 above, then change the names of each of the items to M_EMPLOYEE_ID, M_FIRST_NAME, and M_LAST_NAME (the M is just an indication that these items mirror, or are synchronized with, other items).

In the Synchronize with Item property for each item, select from the pop-list the item with which this item should be synchronized. For example, M_Employee_Id should be synchronized with Employee_Id.

Change other individual properties as shown:

Drag the items to the top of the canvas and arrange them near the top.

Open the MAIN_CV canvas again. To ensure that changes to the layout of the Employees block are preserved, click its Frame (the line that surrounds the items in the Employees block). In the Property Palette for the Frame, change the property Update Layout from Automatically to Manually.

Move the scrollbar from the far right of the MAIN_CV canvas to a position just to the right of the remaining items, then resize the frame width appropriately.

Click Save to save the form, then click Run Form to test it (be sure that you have started OC4J -- see Step 1).

When the form starts running, click Execute Query to display data in the form. Click Next Block to navigate to the Employees block. You still must tab through the items to be able to see them all, but at least now the employee detail displays all in one window. You may notice that navigation through the items on the detail page is not what you might expect; you change the navigation in a later step.

Note: You could use a stacked canvas, rather than a content canvas, to display the employee details. If you had a larger number of items, you could use a tab canvas to display them, arranging the items on different tab pages.

Select the window in the Object Navigator and click Create .

Change the names of both windows by clicking the name in the Object Navigator, then clicking again and overtyping the existing name. Call the original window MAIN_WIN and the new window EMP_DETAILS_WIN.

Note: Alternatively you could change the name in the Property Palette.

In the Property Palette for each window, change its Title property. This changes the title that displays in each window of the running form.

Change the title for MAIN_WIN to Departments and Employees. Change the title for EMP_DETAILS_WIN to Employee Details.

Select the EMP_DETAILS_CV canvas in the Object Navigator. In the Property Palette, change its Window property by selecting EMP_DETAILS_WIN from the pop-up list.

In the Layout Editor for the MAIN_CV canvas, place your cursor at the point where you want the new window to be displayed, and make note of the X and Y coordinates shown at the bottom of the Layout Editor window. In this case, the X and Y coordinates are 210 and 120.

In the Property Palette for the EMP_DETAILS_WIN window, set the X Position and Y Position properties to the values of the X and Y coordinates in the previous step. The example shows setting X Position to 210 and Y Position to 120.

Open the EMP_DETAILS_CV canvas in the Layout Editor and resize the Viewport (black rectangle) so that it is just large enough to display all the items. You may need to maximize the Layout Editor window to be able to see the original lower right point of the viewport.

Note: Resizing the viewport actually resizes the window in which the canvas is displayed. It is a visual way to change the height and width properties of the window without the need to change them directly in the Property Palette.

Click Save to save the form, then click Run Form to test it (be sure that you have started OC4J -- see Step 1).

When the form starts running, click Execute Query to display data in the form. Click Next Block to navigate to the Employees block. Tab through the items so that the separate window is invoked.

Design suggestion: Because you can now see the details along with the main canvas, you may decide to eliminate the synchronized items from the detail canvas.

It may also be helpful to differentiate the current row on the main canvas visually, such as by specifying a different background color for the current item. You can do this by:

	Defining a visual attribute (see the online help topic Creating a Named Visual Attribute)
	Setting a property of the Employees block called Current Record Visual Attribute group to the name of the visual attribute that you defined

Select the Employees block in the Object Navigator and click Create .

Select the option to Build a new data block manually, then click OK.

In the Property Palette for the new block, set Name to CONTROL and set Single Record to Yes. The Single Record property is appropriate for a Control Block because it does not contain multiple records.

Note: Single Record must be set to Yes for a Control Block that contains a summary calculated item.

In the Layout Editor, open the MAIN_CV canvas. Select CONTROL from the Block pop-up list.

Click the Display Item tool , then click in the canvas to the right of the Manager item.

Using the Property Palette, set the following properties on the new item:

A summarized block must have its Query All Records or Precompute Summaries property set to Yes so that the sum includes all records, not only those already retrieved into the block. In the Property Palette for the Employees block, set one of these properties to Yes.

Click Save to save the form, then click Run Form to test it (be sure that you have started OC4J -- see Step 1).

When the form starts running, click Execute Query to display data in the form. Click Next Record to navigate to a department with more than one employee.

Click Next Block to navigate to the Employees block. Tab through the items so that the separate window is invoked.

While the cursor is in the separate window, click Next Record through all existing employee records and verify that the total department salaries figure is correct.

Click Exit Form to exit the application, then close the browser window.

By default, navigation order is determined by the sequence in which objects appear in the Object Navigator.

Open the EMP_DETAILS_CV canvas in the Layout Editor. In the Object Navigator, drag the items in the Employees block to the order in which you want the navigation to occur.

For example, when items are arranged on the canvas as shown below, you want the cursor to move to HIRE_DATE when you tab out of PHONE_NUMBER. To change the sequence, you drag HIRE_DATE in the Object Navigator to the position just after PHONE_NUMBER.

Ignore the items JOB_ID, MANAGER_ID, and DEPARTMENT_ID, because those items are not displayed on any canvas, so navigation to those items does not occur.

You can also use block properties to affect navigation order.

In the Property Palette for the Departments block, change the Navigation Style property to Change Data Block.

3 .

In the Property Palette for the Employees block, change the Navigation Style property to Change Record.

Click Save to save the form, then click Run Form to test it (be sure that you have started OC4J -- see Step 1). Test that the navigation order is the same as what you determined by moving the items in the Object Navigator, that the cursor moves into the Employees block when you tab out of the Department_Name item, and that the cursor moves to the next Employees record when you tab out of the last item in the Employees block.

Click Exit Form to exit the application, then close the browser window.

You can also affect navigation with item properties.

In preparation for some new functionality that you implement with code in a later step, change the following item properties in the Employees block:

Note: When viewing a queried record, this makes it impossible to navigate to the employee details shown on the EMP_DETAILS_CV canvas. You add the ability to navigate to these items in a later step.

Click Save to save the form.

Select the JOB_ID item in the Object Navigator and display its Property Palette. Change its Canvas Property to EMP_DETAILS_CV, change Number of Items Displayed to 1, and change Prompt Attachment Offset to 5.

Open the Layout Editor for the EMP_DETAILS_CV canvas. The JOB_ID item is displayed in the upper left corner. Drag it to the desired position on the canvas.

In the Object Navigator, drag the JOB_ID item to the proper position for the desired navigation order.

Click Save to save the form, then click Run Form to test it (be sure that you have started OC4J -- see Step 1).

Before querying any data, attempt to insert a new Departments record. Enter 99 for the Department_Id and Test for the Department_Name. Click Save . The record should be inserted without error.

Click Remove Record to delete the record that you just inserted, then click Save . The record should be deleted without error.

Click Execute Query . Navigate to the Employees block and click Insert Record .

Enter 999 for the Employee_ID, and enter your own first and last name. Click Save .

Because there are some required items that have no values, you receive an error and Forms automatically navigates to the first null required item. Enter IT_PROG for the Job_Id, then fill in any values you desire for the other items. Then click Save . The record should be saved successfully; notice that the Total Salaries amount is recalculated automatically. You may delete the new record if desired.

Click Exit Form to exit the application, then close the browser window.

In the Object Navigator, right-click the form-level Triggers node, then select SmartTriggers | WHEN-NEW-FORM-INSTANCE from the context menu.

The PL/SQL Editor opens up for the form-level When-New-Form-Instance trigger. Enter the following code:

DO_KEY('EXECUTE_QUERY');

Then click Compile in the PL/SQL Editor. A message showing that the trigger is compiled displays in the lower right corner of the editor.

Click Save .

Under the Departments block in the Object Navigator, select the Triggers node, then click Create .

Type p in the Find box, then select POST-QUERY from the list. Click OK.

The PL/SQL Editor opens up for the block-level Post-Query trigger for the Departments block. The Post-Query trigger fires for every row that is retrieved by a query of the Departments block. Enter the following code:

SELECT CITY || ', ' || STATE_PROVINCE || ', '
|| COUNTRY_ID
INTO :departments.location
FROM locations
WHERE :departments.location_id = location_id;

SELECT FIRST_NAME || ' ' || LAST_NAME
INTO :departments.manager
FROM employees
WHERE :departments.manager_id = employee_id;

Then click Compile in the PL/SQL Editor. A message showing that the trigger is compiled displays in the lower right corner of the editor.

Click Save .

Click the LOVs node in the Object Navigator, then click Create .

Leave the Use the LOV Wizard option selected and click OK.

On the first page of the LOV Wizard, click Next to base the LOV on a new record group based on a query.

For the SQL Query Statement, enter the following:

SELECT job_title TITLE, job_id ID
FROM jobs
ORDER BY job_title

Do not end the statement with a semicolon.

If you want to ensure that the statement is syntactically correct, click Check Syntax. You should receive a message affirming the correctness of the statement; click OK to dismiss this message, then in the LOV Wizard, click Next.

In the LOV you want to display the Job_Title to the user, because this contains information that is meaningful to the user. You decide to also display the Job_Id. Click the double right arrow button to move both record group columns to the LOV, then click Next.

What you are trying to accomplish is to populate the Job_Id item in the Employees block with the ID selected from the query.

Click the Return value column for the ID column, then click Look up return item.... In the Items and Parameters list, select :EMPLOYEES.JOB_ID, then click OK.

Check Automatically size columns, then click Next.

Enter Jobs for the LOV Title, 250 for the Width, and 300 for the Height. Click Next.

Click Next to accept the defaults of retrieving 20 rows at a time and refreshing the record group before displaying the LOV.

You want the LOV to be available from the Job_ID item in the Employees block. Click the right arrow button to move EMPLOYEES.JOB_ID from Return Items to Assigned Items, then click Next, and on the final screen, click Finish.

Click Save .

Open the Layout Editor for the MAIN_CV canvas. Enlarge the Employees frame to the right by selecting it and dragging its resize handle. Move the scrollbar to the right side of the frame.

Select EMPLOYEES from the block list in the Layout Editor. Click the Button tool in the Layout Editor, then click in the area between Last_Name and the scrollbar.

Open the Property Palette for the button and set the following properties:

In the Object Navigator, drag the button to a position just after Last_Name.

Right-click the DETAILS_BTN button, and from the context menu choose SmartTriggers | WHEN-BUTTON-PRESSED.

In the PL/SQL Editor, enter the following code:

GO_ITEM('job_id');

Click Compile .

Click Save .

In the Object Navigator, expand the Last_Name node under the Employees block, and select the Triggers node. Click Create .

In the Triggers window, scroll down and select KEY-NEXT-ITEM, then click OK.

In the PL/SQL Editor, enter the following code, then click Compile :

do_key('next_record');

Click Save .

Select the Triggers node under the HR form, click Create , and choose WHEN-WINDOW-CLOSED from the trigger list, then click OK.

In the PL/SQL Editor, enter the following code, then click Compile:

IF :SYSTEM.CURSOR_ITEM IN ('EMPLOYEES.M_EMPLOYEE_ID',
   'EMPLOYEES.M_FIRST_NAME',
   'EMPLOYEES.M_LAST_NAME',
   'EMPLOYEES.JOB_ID',
   'EMPLOYEES.EMAIL',
   'EMPLOYEES.PHONE_NUMBER',
   'EMPLOYEES.HIRE_DATE',
   'EMPLOYEES.SALARY',
   'EMPLOYEES.COMMISSION_PCT') THEN
   GO_ITEM('employee_id');
   HIDE_WINDOW('emp_details_win');
END IF;

Click Save .

Click Run Form to test it (be sure that you have started OC4J -- see Step 1).

Demonstrate that:

	The form displays the data (executes the query) automatically.
	The Location and Manager items are populated automatically.
	When navigating in the Employees block on the Main canvas, tabbing out of Last_Name navigates to the next employee record.
	Employee details display when you click Details in the Employees block.
	In the Job_Id item you can display and select from an LOV when you press Ctrl + L, and the Job_Id item is populated with the job that you select.
	You can close the detail window.

Click Exit Form to exit the application, then close the browser window.