ComponentOne True DBGrid for WinForms
True DBGrid for WinForms Tutorials / Tutorial 9: Attaching an Arbitrary Drop-Down Control to a Grid Cell
In This Topic
    Tutorial 9: Attaching an Arbitrary Drop-Down Control to a Grid Cell
    In This Topic

    In this tutorial, you will learn how to drop-down an arbitrary control from a grid cell. This example uses a ListBox control containing pre-defined input values in order to facilitate user data entry. The list will drop down whenever the user initiates editing, such as by clicking the current cell. You will also learn how to place a button in the cell which, when clicked, will cause the ListBox control to appear. You can drop-down any control from a grid cell using techniques similar to those described in this tutorial.

    Complete the following steps:

    1. Start with the project constructed in Tutorial 6: Defining Unbound Columns in a Bound Grid.
    2. Add a ListBox control (ListBox1) to the form as shown in the figure.
    3. Set the Visible property of ListBox1 to False.

    Adding code to drop down a ListBox control

    The CustType field in the second column (Column1) of the grid displays numeric values ranging from 1 through 5, which represent the following customer types:

    Drop down ListBox1, which will contain textual customer type descriptions, and allow users to double-click an item in order to enter the associated value into the grid.

    1. Include the following code in the general declaration section of Form1. Adding these namespaces will simplify the code we will need to write later.

      To write code in Visual Basic

      Visual Basic
      Copy Code
      Imports System.Data
      Imports System.Data.Oledb
      Imports System.IO
      Imports System.Collections
      

      To write code in C#

      C#
      Copy Code
      using System.Data;
      using System.Data.Oledb;
      using System.IO;
      using System.Collections;
      
    2. In the Load event of Form1, add the code to include the customer types to ListBox1. Also, place a button in the CustType column using the Button property. The Form1_Load event handler now looks like this:

      To write code in Visual Basic

      Visual Basic
      Copy Code
      Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
          Me.ContactsTableAdapter.Fill(Me.DsContacts.Contacts)
       
          ' Add customer types to ListBox1.
          With Me.ListBox1
              .Items.Add("Prospective")
              .Items.Add("Normal")
              .Items.Add("Buyer")
              .Items.Add("Distributor")
              .Items.Add("Other")
              .Visible = False
          End With
       
          ' Place a button in the CustType column.
          Me.C1TrueDBGrid1.Splits(0).DisplayColumns("CustType").Button = True
      End Sub
      

      To write code in C#

      C#
      Copy Code
      private void Form1_Load(System.object sender,  System.EventArgs e) 
      {
          this.ContactsTableAdapter.Fill(this.DsContacts.Contacts);
       
          // Add customer types to ListBox1.
          this.listBox1.Items.Add("Prospective");
          this.listBox1.Items.Add("Normal");
          this.listBox1.Items.Add("Buyer");
          this.listBox1.Items.Add("Distributor");
          this.listBox1.Items.Add("Other");
          this.listBox1.Visible = false;
       
          // Place a button in the CustType column.
          this.c1TrueDBGrid1.Splits[0].DisplayColumns["CustType"].Button = true;
      }
      
    3. If a cell in the CustType column becomes current, a button will be placed at the right edge of the cell. Clicking the button will trigger the grid's ButtonClick event. We will drop down ListBox1 whenever the button is clicked:

      To write code in Visual Basic

      Visual Basic
      Copy Code
      Private Sub C1TrueDBGrid1_ButtonClick(ByVal sender As Object, ByVal e As C1.Win.C1TrueDBGrid.ColEventArgs) Handles C1TrueDBGrid1.ButtonClick
          With ListBox1
              .Left = Me.C1TrueDBGrid1.Left + Me.C1TrueDBGrid1.RecordSelectorWidth + Me.C1TrueDBGrid1.Splits(0).DisplayColumns(0).Width + Me.C1TrueDBGrid1.Splits(0).DisplayColumns(1).Width
              .Top = Me.C1TrueDBGrid1.Top + Me.C1TrueDBGrid1.RowTop(Me.C1TrueDBGrid1.Row)
              .Visible = True
              .Select()
          End With
      End Sub
      

      To write code in C#

      C#
      Copy Code
      private void c1TrueDBGrid1_ButtonClick(object sender,  C1.Win.C1TrueDBGrid.ColEventArgs e) 
      {
          this.listBox1.Left = this.c1TrueDBGrid1.Left + this.c1TrueDBGrid1.RecordSelectorWidth + this.c1TrueDBGrid1.Splits[0].DisplayColumns[0].Width + this.c1TrueDBGrid1.Splits[0].DisplayColumns[1].Width;
          this.listBox1.Top = this.c1TrueDBGrid1.Top + this.c1TrueDBGrid1.RowTop(this.c1TrueDBGrid1.Row);
          this.listBox1.Visible = true;
          this.listBox1.Select();
      }
      
    4. In the DoubleClick event of ListBox1, add the following code. When an item is selected in ListBox1, this code will copy its index to the proper column in C1TrueDBGrid1, then make ListBox1 invisible.

      To write code in Visual Basic

      Visual Basic
      Copy Code
      Private Sub ListBox1_DoubleClick(ByVal sender As Object, ByVal e As System.EventArgs) Handles ListBox1.DoubleClick
          Me.C1TrueDBGrid1.Columns("CustType").Text = Me.ListBox1.SelectedIndex + 1
          Me.ListBox1.Visible = False
      End Sub
      

      To write code in C#

      C#
      Copy Code
      private void listBox1_DoubleClick(object sender,  System.EventArgs e)  
      {
          this.c1TrueDBGrid1.Columns["CustType"].Text = (this.listBox1.SelectedIndex + 1).ToString();
          this.listBox1.Visible = false;
      }
      
    5. Then in the Leave event of ListBox1, add the following code to make sure the listbox becomes invisible once the selection has been made:

      To write code in Visual Basic

      Visual Basic
      Copy Code
      Private Sub ListBox1_Leave(ByVal sender As Object, ByVal e As System.EventArgs) Handles ListBox1.Leave
          Me.ListBox1.Visible = False
      End Sub
      

      To write code in C#

      C#
      Copy Code
      private void listBox1_Leave(object sender,  System.EventArgs e) 
      {
          this.listBox1.Visible = false;
      }
      
    6. Then in the Scroll event of C1TrueDBGrid1, add the following code to make sure the listbox becomes invisible once the grid is scrolled:

      To write code in Visual Basic

      Visual Basic
      Copy Code
      Private Sub C1TrueDBGrid1_Scroll(ByVal sender As Object, ByVal e As C1.Win.C1TrueDBGrid.CancelEventArgs) Handles C1TrueDBGrid1.Scroll
          Me.ListBox1.Visible = False
      End Sub
      

      To write code in C#

      C#
      Copy Code
      private void c1TrueDBGrid1_Scroll(object sender,  C1.Win.C1TrueDBGrid.CancelEventArgs e) 
      {
          this.listBox1.Visible = false;
      }
      

    Run the program and observe the following:

    You've successfully completed attaching an arbitrary drop-down control to a grid cell; this concludes tutorial 9.