Try OpenEdge Now
skip to main content
Online Help
Introducing the Progress Developer Studio for OpenEdge Visual Designer : Tasks : Developing a visual container : Working with UI controls : Linking controls to data : Data binding example
 
Data binding example
This topic provides step-by-step instructions for creating a data-displaying control and binding it via a ProBindingSource object to an ABL query. The exercise assumes you want your UI to include a data grid that displays the name, city, and state of all customers in the sports2000 database who live in Texas.
To begin, make sure that you have you have configured both an ABL connection and a SQL connection to the sports2000 database, and that the database is connected to your project. Also make sure that the DB Structure view is open (if not, select Window > Show View > OpenEdge Editor > DB Structure).
1. To create the data-displaying control, you must create a form and add a control capable of displaying data:
a. Create a new ABL Form container.
b. In the Toolbox, select either a DataGrid control or, if you have installed the OpenEdge Ultra Controls for .NET, an UltraGrid. (If you use the UltraGrid, you can just click Finish to dismiss the Quick Start wizard.)
2. To create a binding source object and associate it with the grid control:
a. In the DB Structure view, expand the nodes of the SPORTS2000 database tree to show the columns in the Customer table.
b. Select the Name, City, and State columns. Use CTRL+Click to select multiple items.
c. Drag the selection from the DB Structure view and drop it on the grid control on the form. (By doing this, you automatically associate the binding source object with the grid.) The ProBindingSource Designer appears with the Customer table and the three columns that you selected in the Available schema pane on the left.
d. In the Available schema pane, select the Customer node check box.
e. Click Add. The Customer table that you selected appears in the Tables pane and its three columns appear in the Fields pane.
f. To define a recursive relationship for the Customer table, select a table name from the Recursive table list box in the Properties pane. The Customer table is called the base table. Recursive table lists the name of base table and all its parent table in a hierarchical order.
g. Click OK to save the current schema definition. The columns labeled Name, City, and State appear in the DataGrid or UltraGrid control on the form.
You can open the ProBindingSource Designer again at any time to edit the schema. To do so, select the object on the Design Canvas and either click and then ProBindingSource Designer, or click ProBindingSource Designer at the bottom of the Properties view.
3. To bind to the ABL data source, define a query to retrieve the records for all customers who live in Texas:
a. Open the class file for the form in the OpenEdge ABL Editor by right-clicking on the form and selecting View Source.
b. Define handle variable qh, define the query, and set the binding source handle to the query handle. Here is an example of how your code might look:
DEFINE VAR qh AS HANDLE NO-UNDO.
CONSTRUCTOR PUBLIC Form1 ( ):
SUPER().
InitializeComponent ( ).
CREATE QUERY qh.
qh:SET-BUFFERS(BUFFER Customer:HANDLE).
qh:QUERY-PREPARE("FOR EACH customer where customer.state = 'TX'").
qh:QUERY-OPEN ().
proBindingSource1:handle= qh.
END CONSTRUCTOR.

DESTRUCTOR Form1 ( ):
IF VALID-HANDLE(qh) THEN DO:
qh:QUERY-CLOSE().
DELETE OBJECT qh.
END.
END DESTRUCTOR.
c. Save the class file.
4. To test the data-bound grid control you designed, open the form in the Visual Designer and click Run on the main Eclipse toolbar. The control should display the retrieved records from the database: