Table View Tutorial. Step 1: Bind to a Data Source

• Oct 25, 2021
• 3 minutes to read

This step describes how to bind a grid control to a database.

Before You Start

All data files used in this tutorial are shipped with demos. Data files are available here: C:\Users\Public\Documents\DevExpress\VCL\Demos\ExpressQuantumGrid\Data\

If you have no installed demos, open the installation file and follow the steps below:

1. Click “Modify” in the Action tab.

   

2. Go to the Options tab and check “Install demos”.

   

3. Go to the “Ready to Install” tab and run the installation.

Add a Grid Control to the Form

Place a grid control (TcxGrid) from the Tool Palette on the form. Set the control’s Align property to alClient in the Object Inspector to allow the control to occupy the form’s client area.

Use the Structure Navigator at the control’s right-bottom corner to manage the grid structure.

A grid control can consist of multiple levels associated with the corresponding Views. Now the control includes one grid level (cxGrid1Level1) and a data-aware Table View (cxGridDBTableView1).

Rename the level and View. Click the corresponding element in the Structure Navigator and change the Name property to lvEmployees and tvEmployees in the Object Inspector.

Populate a Dataset

Add a TdxMemData component to the form. This component is a memory-based dataset that you can link to a data-aware control.

Change the component’s name to mdEmployees.

Right-click the component and select “Persistent Editor…” in the context menu to invoke the dialog that allows you to manage datasets.

Follow the steps below to populate the dataset:

1. Click the “Get Fields…” button to load columns from a file. Select the Employees.dat file available here: C:\Users\Public\Documents\DevExpress\VCL\Demos\ExpressQuantumGrid\Data\

2. Click the “Load…” button to populate dataset fields with data. Select the same file in the opened dialog.

Note

You should install demos to use demo datasets.

The image shows the result:

Click OK to apply changes and close the Persistent Editor.

Enable the component’s Active property to allow a bound control to manage stored data.

Link the View to a Data Source

Add a TDataSource component that allows you to bind a dataset to the View. Rename the component dsEmployees.

Set the component’s DataSet property to mdEmployees to link it to the previously created dataset.

Right-click the DB Table View in the Structure Navigator and select “Link to dsEmployees” to display the dataset in the View.

Run the application to review the data.

The next step describes how to reduce the number of displayed grid columns, customize column options, and display data in a more user-friendly format (replace numeric identifiers with strings and convert plain text to hyperlinks).

Tip

Press Ctrl+H to hide non-visual components that can overlap the View’s content.