Microsoft Visual Studio introduces a System.Windows.Forms.BindingSource component, which simplifies binding data-aware controls to data. For information on this component, please refer to the BindingSource component [Windows Forms] topic in MSDN.
This topic shows how to use a BindingSource component to bind a GridControl to the "Orders" and "Order Details" tables in the NorthWind database (nwind.mdb file is shipped with the installation of the data-aware DevExpress controls). These tables are linked by a one-to-many relationship (a single row in the first table can be related to one or more rows in the second table, but a row in the second table can be related to only one row in the first table). In the example below, the grid will represent these tables as master and detail levels (Views).
After you perform the steps in this example, the result will be similar to the following.
Steps 1-8. Binding Grid to Data
- Start Visual Studio and create a new Windows Forms application. Drop a GridControl onto your application form.
- Open the GridControl Tasks pane by clicking the Grid's tag button.
- Expand the 'Choose Data Source' popup panel and click the 'Add Project Data Source…' link.
- Select 'Database' and click 'Next'.
- Select 'Dataset' and click 'Next'.
- Specify the path and connection settings to the NorthWind database (nwind.mdb) via the subsequent dialogs.
- The next page allows you to choose which tables need to be obtained from the database. Select the 'Orders' and 'Order Details' tables, and then click Finish.
This creates a DataSet with two DataTables encapsulating the 'Orders' and 'Order Details' tables.
- The GridControl should display the 'Order' table as a master data table. To bind to this table, click 'Orders' in the 'Choose Data Source' popup pane.
If you run your application now, you will notice inactive row expansion buttons since the 'Order Details' table is empty.
The next section will show you how to populate the 'Order Details' table data.
Steps 9-11. Populating Grid with Detail Data.
As you see, Visual Studio generated a set of classes that support ADO.NET architecture:
- nwindDataSet - a System.Data.DataSet object (a collection of tables that can be related to each other). This generated DataSet contains the OrdersDataTable and Order_DetailsDataTable tables, and specifies a one-to-many relationship between them.
- ordersBindingSource - a BindingSource object that binds the 'Orders' table stored in the nwindDataSet to the Grid. This data is displayed as a master View.
- ordersTableAdapter - a TableAdapter object that can communicate to the 'Orders' table in the NorthWind database. A TableAdapter object contains methods to get data from and post data to a corresponding table in the database.
To populate the 'Order Details' table data, create another TableAdapter that will communicate to this table.
- Open the Visual Studio's Toolbox window and add the Order_DetailTableAdapter object onto your application form (the solution needs to be built beforehand).
- Shift to application code by pressing F7. As you will see, the following code already exists:
| ||||||
private void Form1_Load(object sender, EventArgs e) { this.ordersTableAdapter.Fill(this.nwindDataSet.Orders); } |
11. This code calls the Fill method for the ordersTableAdapter object that populates the nwindDataSet.Orders table with data. To populate the 'Order Details' table, add the following code:
| ||||||
this.order_DetailsTableAdapter.Fill(this.nwindDataSet.Order_Details); |
- Run the solution. Now master rows can be expanded to view detail rows.
Steps 12-13. Customizing the Grid
12. Hiding Columns
The grid's main View (gridView1) contains too many columns. Although it is possible to use an Advanced Banded Grid View to arrange the columns in multiple rows, we will simply hide specific columns. To hide the 'ShippedDate' column, drag and drop its header outside the header panel (the mouse cursor will change its shape to a cross).
13. Creating a Detail View
A detail View to represent the detail table ('Order Details') is not created at design time. Only the master View (gridView1) is created. If a detail View is not created at design time, XtraGrid automatically creates detail Views at runtime (based on the master view's settings) when master rows are expanded. To have the ability to customize detail views at design time, you need to, for instance, create a pattern detail View using the grid's Level Designer.
Click the Retrieve Details button in the Level Designer. Click Yes in the dialog that is invoked. As a result, XtraGrid returns all the master-detail relationships in the underlying data source and represents them as levels. In this example, a single detail level is created. Its name ('OrdersOrder Details') matches the relationship's name. Now it is possible to assign a specific View to the created detail level. Click the 'Click here to change view' link and select Create new view -> GridView command.
The grid will create a new view (type of GridView) and associate it with the "OrdersOrder Details" level.
Click the Run Designer button and select gridView2 from the list box at the designer's top left corner:
Switch to the 'Columns' page and click the Retrieve Fields button to create columns for all the fields in the underlying detail table:
When the Designer is closed, the gridView2 will display all the columns from the 'Order Details' table.
14. Other Tasks
There are many things that you may want to do with a grid control. To help you find out which options relate to which specific features, use the Feature Browser that is accessible via the grid's Designer. This is a powerful tool for finding answers to many questions.
Step 16. Posting Data Back to the Database
16. You can run the project and start editing data. The changes will be saved in the underlying DataTable objects, but they will not be saved in the database. To complete the example, write the code that posts the changes in the OrdersDataTable and Order_DetailsDataTable tables back to the database. The FormClosing event is handled for that purpose.
| ||||||
private void Form1_FormClosing(object sender, FormClosingEventArgs e) { DevExpress.XtraGrid.Views.Base.BaseView view = gridControl1.FocusedView; if (!(view.PostEditor() && view.UpdateCurrentRow())) { e.Cancel = true; return; } ordersTableAdapter.Update(nwindDataSet.Orders); order_DetailsTableAdapter.Update(nwindDataSet.Order_Details); } |
Result
The following image illustrates the resulting grid at runtime.
No comments:
Post a Comment