Creating Address Book Search Panel

  1. In the Projects panel located on the left, expand the ViewController, Web Content, and fragments nodes and double-click the AddressBookList.jsff page fragment.

    This will display the page fragment in the design panel in the middle.

  2. Select the source tab at the bottom of the panel. Insert a Panel Stretch Layout between the ui:composition tags from the Components palette and set the following attributes:

    • startWidth: 350px

    • inlineStyle: margin:10px;

    • dimensionsFrom: parent

  3. Insert a second Panel Stretch Layout component in the start facet of the first Panel Stretch layout and set the following attribute:

    topHeight: 40px

  4. Insert a Panel Group Layout component inside the top facet of the inner Panel Stretch Layout. Set the layout attribute to horizontal.

  5. Insert an Input Text Component inside the Panel Group Layout and set the following attributes:

    • label: Name

    • value: #{pageFlowScope.alphaNameFilter}

  6. Insert a Spacer component after the Input Text component and set its width attribute to 12px.

  7. Insert a Button component after the Spacer component and change the text attribute to Search.

  8. Set focus on the Button component and then select the Edit option next to the ActionListener property in the Properties panel.

  9. On the Edit Property: ActionListener form, click the New button next to the Managed Bean drop-down list, and set the following fields:

    • Bean Name: addressBookListenerBean

    • Class Name: AddressBookListenerBean

    • Scope: request (Use default)

  10. Click OK to create the class and the managed bean declaration in the E01012_AddressBook_BTF.xml.

  11. Select the New button next to the Method drop-down list and set the following field:

    Method Name: searchAddressBook

  12. Click OK to create the method and click OK again to close the Edit Property form.

  13. Insert a Spacer component after the ADF Button and set its width attribute to 8px.

  14. Insert a Button component after the Spacer, and set the following attributes:

    • action: exit

    • text: Close

    • rendered: #{!pageFlowScope.pageEmbedded}

  15. From the Data Controls panel, drag the rowset member in addressBook > fs_P01012_W01012B > data > gridData into the center facet of the inner Panel Stretch Layout.

    You will be prompted to specify the type of component to add.

  16. Select Table/List View > ADF List View and then click Next and Finish to add the component.

  17. Delete the separator facet inside of the Panel Group Layout.

  18. Select the Bindings tab at the bottom of the panel.

  19. In the Bindings list on the left, highlight the rowset binding and click the pencil icon to edit the binding.

  20. On the Edit Tree Binding form, click the green '+' icon and select mnAddressNumber_19.

  21. Select the parent folder, click the green icon again, and then select SAlphaName_20. You can ignore the "Rule Already Exists for the selected Accessor" error.

  22. Click the OK button to save the binding changes.

  23. In the Bindings list, click the green '+' icon to add a new binding.

  24. On the Insert Item form, select action from the list and click the OK button.

  25. On the Create Action Binding form, expand the AddressBookDC node and select the Execute operation under addressBookDetail.

  26. Click the OK button to add the binding.

  27. Click the green '+' icon again to add a second binding.

  28. On the Insert Item form, select methodAction from the list and click the OK button.

  29. On the Create Action Binding form, expand the AddressBookDC node and select the retrieveAddressBookList() method. Click the OK button to add the binding.

  30. Click the green '+' icon again to add a third binding.

  31. On the Insert Item form, select methodAction from the list and click OK.

  32. On the Create Action Binding form, expand the AddressBookDC node and select the processSelectedAddress(int) method. Click OK to add the binding.

  33. Click Save All from the toolbar.

  34. Select the Source tab at the bottom of the panel.

  35. Insert an Output Text Component inside the Panel Group Layout of the List View and set the value attribute to #{item.mnAddressNumber_19.bindings.value.inputValue} - #{item.SAlphaName_20.bindings.value.inputValue}.

  36. Set focus on the List View component and then select the Edit option next to the SelectionListener property in the Properties panel.

  37. On the Edit Property: SelectionListener form, select addressBookListenerBean from Managed Bean drop-down list.

  38. Select the New button next to the Method drop-down list and set the following field:

    Method Name: addressRecordSelected

  39. Click the OK button to create the method and click OK again to close the Edit Property form.

  40. Set the List View binding attribute to #{addressBookListenerBean.listView} and the selection attribute to single.

  41. Set focus on the List View component and then select the Edit option next to the PartialTriggers property in the Properties panel.

  42. On the Edit Property: PartialTriggers form, expand the top facet and panel group layout components and double-click button-b1 from the Available panel to move it to the Selected panel.

  43. Click the OK button to set the attribute value.

  44. In the Projects panel, expand the ViewController and Application Sources nodes and open the com.oracle.e1.E01012.view.AddressBookListenerBean.java class.

  45. Add the code shown below to AddressBookListenerBean.java.

    private ComponentReference listView;
    private ComponentReference form;
     
    public AddressBookListenerBean()
    {
    }
     
    public void searchAddressBook(ActionEvent actionEvent)
    {
        	// Reset index of list view iterator.
    	    BindingContainer bc = BindingContext.getCurrent().getCurrentBindingsEntry();
        	DCIteratorBinding rowsetItr = ((DCBindingContainer) bc).findIteratorBinding("rowsetIterator");
        	if (rowsetItr != null)
        	{
    		        rowsetItr.clearForRecreate();
     
            		rowsetItr.setCurrentRowIndexInRange(0);
        	}
     
        	// Reset list view's selected row keys so no list item is initially highlighted.
        	resetListViewSelectedItem();
     
        	// Execute data conrol method to retrieve list of Adress Book records.
    	    OperationBinding methodBinding = bc.getOperationBinding("retrieveAddressBookList");
        	if (methodBinding != null)
    	    {
            		methodBinding.execute();
            		refreshAddressBookDetailIterator(bc);
        	}
    }
     
    public void addressRecordSelected(SelectionEvent event)
    {
        	RichListView listView = getListView();
     
        	// Retrieve index of selected list item row.
        	RowKeySetTreeImpl selectedRowKeys = (RowKeySetTreeImpl) listView.getSelectedRowKeys();
    	    List rowKeyList = (List) selectedRowKeys.iterator().next();
        	Key rowKey = (oracle.jbo.Key) rowKeyList.get(0);
        	int rowIndex = ((Integer) rowKey.getKeyValues()[0]).intValue();
    
    	    AdfFacesContext.getCurrentInstance().addPartialTarget(listView);
     
    	    // Launch data control method to retrieve Address Book detail based on selected address number.
        	BindingContainer bc = BindingContext.getCurrent().getCurrentBindingsEntry();
    	    OperationBinding methodBinding = bc.getOperationBinding("processSelectedAddress");
        	if (methodBinding != null)
    	    {
            		Map args = methodBinding.getParamsMap();
    		        args.put("rowIndex", rowIndex);
            		methodBinding.execute();
     
    		        // Refresh detail panel.
    		        AdfFacesContext.getCurrentInstance().addPartialTarget(form.getComponent());      
            		refreshAddressBookDetailIterator(bc);
        	}
    }
     
    private void refreshAddressBookDetailIterator(BindingContainer bc)
    {
    	    // Execute iterator binding to refresh Addrss Book detail panel.
        	OperationBinding abDetailIterator = bc.getOperationBinding("Execute");
    	    if (abDetailIterator != null)
    	    {
    		        abDetailIterator.execute();
        	}
    }
     
    public void resetListViewSelectedItem()
    {
    	    getListView().setSelectedRowKeys(new RowKeySetTreeImpl());
    }
     
    public void setListView(RichListView listView)
    {
    	    this.listView = ComponentReference.newUIComponentReference(listView);
    }
     
    public RichListView getListView()
    {
    	    if (listView != null)
        	{
            		return (RichListView) listView.getComponent();
        	}
        	return null;
    }
     
    public void setForm(RichPanelFormLayout form)
    {
    	    this.form = ComponentReference.newUIComponentReference(form);
    }
     
    public RichPanelFormLayout getForm()
    {
    	    if (listView != null)
        	{
    		        return (RichPanelFormLayout) form.getComponent();
    	    }
    	    return null;
    }
    
  46. Save changes to AddressBookListenerBean and build the class.