The ProBindingSource control, bindingSource1, is now the data source for the UltraGrid control. The UltraGrid control on the Design Canvas (see the following figure) displays bands of data with representative values, based on data type, in various fields. It also shows the label specified for each field.

Figure 1. The UltraGrid control in the Customer form


When you expand the node, bands representing the child table appear, as shown in the following figure. The child table is esalesrep, which you specified when you created the ProBindingSource control, bindingSource1.

Figure 2. The UltraGrid with the data band expanded


At run time, the UltraGrid is filled with Customer and SalesRep data supplied by the ProBindingSource. Before you can fill the UltraGrid control with actual data, however, you have to attach the ProBindingSource to an ABL data source. You can think of a ProBindingSource as a kind of intermediary between .NET controls and ABL data sources. It facilitates the transfer of data, and it takes care of the mapping of data types between .NET and ABL.

Up to this point, you only have half of the binding in place—the binding between ultraGrid1 and bindingSource1. To complete the binding you need to bind bindingSource1 to the ABL data source, which, in the Sample Application, is accessed through a service adapter.

Note: Use of a service adapter conforms to the layered approach to data access and application design. The UI (customerForm.cls) is separate from the business logic (beCustMaint.cls), which it accesses through a service adapter (serviceAdapter.cls). The business logic gets its data from the sports2000 database, which is running as a resource to the SampleApp project.

The code for binding bindingSource1 to the data source is not automatically generated. You must edit customerForm.cls to add the code necessary to perform the binding. That code also includes open and close query methods and updates to the CONSTRUCTOR and DESTRUCTOR.

CAUTION: Be careful not to modify any of the code that was generated by the Visual Designer. There is a danger you will not be able to reopen a file in the Visual Designer after modifying generated code in the ABL Editor.

In particular:

Do not add, edit, or delete any VisualDesigner annotations. Annotations are lines that are preceded by @ (for example, @VisualDesigner.FormMember.).

Do not add, edit, or delete any code in the InitializeComponent() method.

Do not delete or edit any code in the CONSTRUCTOR or DESTRUCTOR. You can, however, add code to these blocks.

To define the query:

  1. With customerForm.cls open in the Visual Designer Editor, press F9 to open the file in the ABL Editor.

    You can also select customerForm.cls in the Project Explorer view, and choose Open With > OpenEdge ABL Editor from the context menu.

    Note: The Visual Designer and the ABL Editor are synchronized so that a change in one is reflected in the other. For example, if you add a control to a form by dragging and dropping in the Visual Designer, the code visible in the ABL Editor will be updated.
  2. Define a variable for the service adapter by adding the following declaration: 
    DEFINE PRIVATE VARIABLE oServiceAdapter AS openedge.tutorial.services.serviceAdapter.

    You can add it to the other variable declarations, which appear after the CLASS declaration at the beginning of the file.

    Note: If you are viewing this manual on line, you can copy code snippets from the manual directly to the file in the ABL Editor. The code might be poorly formatted, but it will run.

    An alternative is to copy the code from the completed files in the SampleAppSolution\openedge\tutorial\ui folder. The SampleAppSolution folder should be in the same workspace as the SampleApp folder.

  3. Define the open and close query methods by adding the following code before the DESTRUCTOR statement near the end of the file: 
    /* openQuery */ 
   METHOD PRIVATE VOID openQuery():
        bindingSource1:handle = oServiceAdapter:getDatasetHandle().
    END METHOD.   
  
  /* closeQuery */
    METHOD PRIVATE VOID closeQuery():
        oServiceAdapter:closeQuery().
    END METHOD.
    Note: You can add methods with the Add Methods dialog (Source > Add Method), which provides a standardized template. However, in this tutorial, it is easier to copy the code samples from this book and paste them into your source files.
  4. Press CTRL+S to save your changes.