Export (0) Print
Expand All

Walkthrough: Creating a User Control that Supports Complex Data Binding 

When displaying data on forms in Windows applications, you can choose existing controls from the Toolbox, or you can author custom controls if your application requires functionality that is not available in the standard controls. This walkthrough shows how to create a control that implements the ComplexBindingPropertiesAttribute. Controls that implement the ComplexBindingPropertiesAttribute contain a DataSource and DataMember property that can be bound to data. Such controls are similar to a DataGridView or ListBox.

For more information on control authoring, see Developing Windows Forms Controls at Design Time.

When authoring controls for use in databinding scenarios you need to implement one of the following data-binding attributes:

Databinding Attribute Usage

Implement the DefaultBindingPropertyAttribute on simple controls, like a TextBox, that display a single column (or property) of data. For more information, see Walkthrough: Creating a User Control that Supports Simple Data Binding.

Implement the ComplexBindingPropertiesAttribute on controls, like a DataGridView, that display lists (or tables) of data. (This process is described in this walkthrough page.)

Implement the LookupBindingPropertiesAttribute on controls, like a ComboBox, that display lists (or tables) of data but also need to present a single column or property. For more information, see Walkthrough: Creating a User Control that Supports Lookup Databinding.

This walkthrough creates a complex control that displays rows of data from a table. This example uses the Customers table from the Northwind sample database. The complex user control will display the customers table in a DataGridView in the custom control.

During this walkthrough, you will learn how to:

  • Create a new Windows Application.

  • Add a new User Control to your project.

  • Visually design the user control.

  • Implement the ComplexBindingProperty attribute.

  • Create a dataset with the Data Source Configuration Wizard.

  • Set the Customers table in the Data Sources Window to use the new complex control.

  • Add the new control by dragging it from the Data Sources Window onto Form1.

In order to complete this walkthrough, you will need:

The first step is to create a Windows Application.

To create the new Windows project

  1. In Visual Studio, from the File menu, create a new Project.

  2. Name the project ComplexControlWalkthrough.

  3. Select Windows Application and click OK. For more information, see Creating Windows-based Applications.

    The ComplexControlWalkthrough project is created and added to Solution Explorer.

Because this walkthrough creates a complex data-bindable control from a User Control, you must add a User Control item to the project.

To add a user control to the project

  1. From the Project menu, choose Add User Control.

  2. Type ComplexDataGridView in the Name area, and then click Add.

    The ComplexDataGridView control is added to Solution Explorer and opens in the designer.

This step adds a DataGridView to the user control.

To design the ComplexDataGridView control

  • Drag a DataGridView from the Toolbox onto the user control's design surface.

For complex controls that support data binding, you can implement the ComplexBindingPropertiesAttribute.

To implement the ComplexBindingProperties attribute

  1. Switch the ComplexDataGridView control to code view. (On the View menu, select Code.)

  2. Replace the code in the ComplexDataGridView with the following:

    using System.Windows.Forms;
    
    namespace CS
    {
        [System.ComponentModel.ComplexBindingProperties("DataSource", "DataMember")]
        public partial class ComplexDataGridView : UserControl
        {
            public object DataSource
            {
                get{ return dataGridView1.DataSource; }
                set{ dataGridView1.DataSource = value; }
            }
    
            public string DataMember
            {
                get{ return dataGridView1.DataMember; }
                set{ dataGridView1.DataMember = value; }
            }
    
            public ComplexDataGridView()
            {
                InitializeComponent();
            }
        }
    }
    
    
    package JSL;
    
    /**@attribute System.ComponentModel.ComplexBindingProperties("DataSource", "DataMember")
     */
    public class ComplexDataGridView extends System.Windows.Forms.UserControl
    {
        /**@property
         */
        public Object get_DataSource()
        {
            return dataGridView1.get_DataSource();
        }
    
        /**@property
         */
        public void set_DataSource(Object value)
        {
            dataGridView1.set_DataSource(value);
        }
    
        /**@property
         */
        public String get_DataMember()
        {
            return dataGridView1.get_DataMember();
        }
    
        /**@property
         */
        public void set_DataMember(String value)
        {
            dataGridView1.set_DataMember(value);
        }
    
        public ComplexDataGridView()
        {
            InitializeComponent();
        }
    
        private System.Windows.Forms.DataGridView dataGridView1;
        private System.ComponentModel.IContainer components;
    
        #region Component Designer generated code
        protected void Dispose(boolean disposing)
        {
            if (disposing)
            {
                if (components != null)
                {
                    components.Dispose();
                }
            }
            super.Dispose(disposing);
        }
    
        private void InitializeComponent()
        {
            this.dataGridView1 = new System.Windows.Forms.DataGridView();
            ((System.ComponentModel.ISupportInitialize)(this.dataGridView1)).BeginInit();
            this.SuspendLayout();
            // 
            // dataGridView1
            // 
            this.dataGridView1.set_ColumnHeadersHeightSizeMode(System.Windows.Forms.DataGridViewColumnHeadersHeightSizeMode.AutoSize);
            this.dataGridView1.set_ImeMode(System.Windows.Forms.ImeMode.Disable);
            this.dataGridView1.set_Location(new System.Drawing.Point(16, 16));
            this.dataGridView1.set_Name("dataGridView1");
            this.dataGridView1.set_Size(new System.Drawing.Size(240, 150));
            this.dataGridView1.set_TabIndex(0);
            // 
            // ComplexDataGridView
            // 
            this.set_AutoScaleDimensions(new System.Drawing.SizeF(6F, 13F));
            this.set_AutoScaleMode(System.Windows.Forms.AutoScaleMode.Font);
            this.get_Controls().Add(this.dataGridView1);
            this.set_Name("ComplexDataGridView");
            this.set_Size(new System.Drawing.Size(307, 205));
            ((System.ComponentModel.ISupportInitialize)(this.dataGridView1)).EndInit();
            this.ResumeLayout(false);
    
        }
        #endregion
    }
    
    
  3. From the Build menu, choose Build Solution.

This step uses the Data Source Configuration Wizard to create a data source based on the Customers table in the Northwind sample database. You must have access to the Northwind sample database to create the connection. For information on setting up the Northwind sample database, see How to: Install Sample Databases.

To create the Data Source

  1. On the Data menu, click Show Data Sources.

  2. In the Data Sources window, select Add New Data Source to start the Data Source Configuration Wizard.

  3. Select Database on the Choose a Data Source Type page, and then click Next.

  4. On the Choose your Data Connection page do one of the following:

    • If a data connection to the Northwind sample database is available in the drop-down list, select it.

      -or-

    • Select New Connection to launch the Add/Modify Connection dialog box. For more information, see Add/Modify Connection Dialog Box (General).

  5. If your database requires a password, select the option to include sensitive data, and then click Next.

  6. Click Next on the Save connection string to the Application Configuration file page.

  7. Expand the Tables node on the Choose your Database Objects page.

  8. Select the Customers table, and then click Finish.

    The NorthwindDataSet is added to your project and the Customers table appears in the Data Sources window.

Within the Data Sources window you can set the control to be created prior to dragging items onto your form.

To set the Customers table to bind to the ComplexDataGridView control

  1. Open Form1 in the designer.

  2. Expand the Customers node in the Data Sources window.

  3. Click the drop-down arrow on the Customers node and choose Customize.

  4. Select the ComplexDataGridView from the list of Associated Controls in the Data UI Customization Options dialog box.

  5. Click the drop-down arrow on the Customers table and choose ComplexDataGridView from the control list.

You can create the data-bound controls by dragging items from the Data Sources window onto your form.

To create data-bound controls on the form

  • Drag the main Customers node from the Data Sources window onto the form and verify that the ComplexDataGridView control is used to display the table's data.

To run the application

  • Press F5 to run the application.

Depending on your application requirements, there are several steps you may want to perform after creating a control that supports databinding. Some typical next steps include:

Community Additions

ADD
Show:
© 2014 Microsoft