In this exercise we will create a page with dependent list boxes.

Page will be created where there is a department list box. Based on the department, employee list box will be filled.
1. In the database create a table Name l Type ------------------------------ -------- ---------------------USER_ID VARCHAR2(30) PASSWORD VARCHAR2(30) EMPLOYEE_ID NUMBER(6) DEPARTMENT_ID NUMBER(4) .

2. Created one Entity object with name VikUser based on tabove table.
3. Created view object based on above created entity object with name VikUserViewObj. 4. Created one view object to act as source for the department list box with name DeptViewObj. “SELECT department_id,department_name FROM departments”

5. Created one more view object to act as a source for Employee list box EmpListViewObj
“SELECT employee_id,first_name || ' ' || last_name "emp_name" FROM employees WHERE department_id = (:TheDeptId)” where TheDeptId is the bind variable. 6. Add all the above View objects in the application module. 7. Create one jspx page DependentList.jspx. 8. Add the panelPage to the DependentList page. 9. Drag and drop the VikUserViewObj1 from the Data Control palette on the page. 10. From the Context menu select FormsADF Form.

11. In the Edit Column window click on ok. 12. Set the render property of the DepartmentId and EmployeeId inputText items to false.

13. Drag and drop the DepartmentId under the ViKUserViewObj1 and drop it under the
panelForm.

14. Select Single Selection ADF Select One Choice from context menu.
15. In the List Binding Editor, click on the Add button against the List Data Source drop down. And select DeptViewObj1 from the Add Data Source window. 16. Select Display Attribute as DepartmentName.

And click on Ok button. 17. Similarly select the EmployeeId under the ViKUserViewObj1 and drop it under the panelForm. 18. Select Single Selection ADF Select One Choice from context menu. 19. In the List Binding Editor, click on the Add button against the List Data Source drop down. And select EmpListViewObj1 from the Add Data Source window. 20. Select Display Attribute as EmpName. And click on ok. 21. Now set the autoSubmit property of the department list box to true.And id to DeptList. 22. Set the PartialTrigger property of the Employee list to the DeptList.

23. Right click on the page and go to Page definition. 24. Right click on the bindings in structure window and select action from context menu.

25. Select the EmpListViewObj1 from the Data Collection and select Action as
ExecuteWithParams. And set the value under parameters section to #{bindings.DepartmentId.inputValue}. It means that the Bind variable that we defined in the EMpListViewObj1 will be bind to the value of the DepartmentId selected from the Department list. 26. Now select the executables under the Structure window, right click and select invoked action. 27. In the Common properties under the “Insert invokdeAction” window, set id = InvokeActionExecuteWithParams and Binds= ExecuteWithParams. 28. In the Common properties under the “Insert invokdeAction” window set refersh =renderModel.

29.

These we have done to invoked the action created in step 25. Pull up the invokdeAction “InvokeActionExecuteWithParams” above the EmpListViewObj1Iterator under the executables. This means that the bind variable should be set before the Iterator fetches the results

Sign up to vote on this title
UsefulNot useful