New to Telerik UI for WinForms? Download free 30-day trial

Design Time Data Binding

This tutorial will show you how to bind RadDiagram from the Visual Studio design time surface, by only using the RadDiagram design-time support, and without writing any code. The tutorial uses a data base containing two tables illustrated below:

diagram-data-binding-design-time-data-binding 010

Follow the steps:

  1. Open Visual Studio and start a new Windows Forms project. Open the form, created by the project.

  2. Drag a RadDiagram from the toolbox to your form.

  3. Select RadDiagram and open its ActionList (smart tag). In it, there is a DataSource property. Select the Add Project Data Source... link. This step will display the Data Source Configuration Wizard.

    diagram-data-binding-design-time-data-binding 001

  4. In the Data Source Configuration Wizard >> Choose a Data Source Type page, select the Database icon. Click the Next button.

    diagram-data-binding-design-time-data-binding 002

  5. In the Choose Your data Connection page click the New Connection... button. This step will display the Add Connection dialog.

    diagram-data-binding-design-time-data-binding 003

  6. Select the Microsoft Access Database File data source. After specifying the Database file name, click the OK button to close the Change Data Source dialog.

    diagram-data-binding-design-time-data-binding 004

  7. In the Choose Your Database Objects page, select the "Shapes" and "Connections" check-boxes. Click the Finish button to close the Data Source Configuration Wizard.

    diagram-data-binding-design-time-data-binding 005

  8. In the Smart tag >> DataSource drop down, select the "Shapes" table. This step will create DataSet, BindingSource and TableAdapter objects for the shapes table. Repeat the same step for the "Connections" table.

    diagram-data-binding-design-time-data-binding 006

  9. Select the generated DataSet for the DataSource property.

    diagram-data-binding-design-time-data-binding 007

  10. In the smart tag or in the properties window set the member properties in the following way.

    diagram-data-binding-design-time-data-binding 009

  11. Run the application

    diagram-data-binding-design-time-data-binding 008

In this article