c# Populate datagridview based on ComboBox Item Selected

Question

I have this datagrid where Combobox is populated from Db.

What I'm trying to achieve is that when I select something in the column "Esercizio", the cell of "Video" column auto populate with respective value from the "link_video" column of Db.

So if I select "kickback", I need to see the link video of kickback from db in the textbox cell.

Here's the code that i use to populate the combobox on form load:

private void Myform_Load(object sender, EventArgs e) {

        con = new SqlConnection("Data Source=(LocalDB)\\etc");
        cmd = new SqlCommand();
        con.Open();
        cmd.Connection = con;
        cmd.CommandText = "SELECT * FROM Esercizi";
        dr = cmd.ExecuteReader();

        while (dr.Read())
        {
          //populate Column1 combobox with "nome" column from Esercizi db table
            Column1.Items.Add(dr["nome"]);
            
        }

        con.Close();
    }

datagridview

EDIT I've figured out with 2 new problems.

I'm trying to load a saved workout from db but when I do this, no video link populate the dgv as the grid event doesn't fire.

What I've tried is to add a foreach loop to a new selectionindexchanged function and to fire it at the end of the Load Button code like this:

private void curCombo_LoadedValues(object sender, EventArgs e)
        {

            foreach (DataGridViewRow row in dataGridView1.Rows)
            {
                foreach (DataGridViewCell cell in row.Cells)
                {
                    if (curCombo != null && curCombo.SelectedValue != null)
                    {
                        ExerciseAndVideo selectedExercise = (ExerciseAndVideo)curCombo.SelectedItem;
                        dataGridView1.CurrentRow.Cells["Video"].Value = selectedExercise.Video;

                    }
                }
            }
        }

private void button9_Click(object sender, EventArgs e){

    string connectionString = "Data Source=(LocalDB)\\etc";
    string sql = "SELECT * FROM Schede WHERE Id = 6 AND dgv = 'dataGridView1'";
    SqlConnection connection = new SqlConnection(connectionString);
    SqlDataAdapter dataadapter = new SqlDataAdapter(sql, connection);using (DataTable dt = new DataTable())
    {
        dataadapter.Fill(dt);

        //Set AutoGenerateColumns False
        dataGridView1.AutoGenerateColumns = false;

        //Set Columns Count
        dataGridView1.ColumnCount = 6;

        //Add Columns

        dataGridView1.Columns[0].Name = "Esercizio";
        dataGridView1.Columns[0].HeaderText = "Esercizio";
        dataGridView1.Columns[0].DataPropertyName = "Esercizio";

        dataGridView1.Columns[1].Name = "Serie";
        dataGridView1.Columns[1].HeaderText = "Serie";
        dataGridView1.Columns[1].DataPropertyName = "Serie";

        dataGridView1.Columns[2].HeaderText = "Ripetizioni";
        dataGridView1.Columns[2].Name = "Ripetizioni";
        dataGridView1.Columns[2].DataPropertyName = "Ripetizioni";

        dataGridView1.Columns[3].Name = "Recupero";
        dataGridView1.Columns[3].HeaderText = "Recupero";
        dataGridView1.Columns[3].DataPropertyName = "Recupero";

        dataGridView1.Columns[4].Name = "Time Under Tension";
        dataGridView1.Columns[4].HeaderText = "Time Under Tension";
        dataGridView1.Columns[4].DataPropertyName = "Time_Under_Tension";

        dataGridView1.DataSource = dt;

        connection.Close();

        
    }

    curCombo_LoadedValues();
}

But I get this error "the are no arguments for the obligatory parameter sender...

How I can call it correctly?

The second Issue is that when I populate some dgv columns like this, combos stops working correctly and I get an error exception on the combobox :

dataGridView1.Rows.Add(7);
            Random rnd = new Random();
            
            dataGridView1.Rows[0].Cells[1].Value = 3;
            dataGridView1.Rows[0].Cells[2].Value = rnd.Next(1, 13);
            dataGridView1.Rows[0].Cells[3].Value = 1;
            dataGridView1.Rows[0].Cells[4].Value = 201;
            
            dataGridView1.Rows[1].Cells[1].Value = 2;
            dataGridView1.Rows[1].Cells[2].Value = rnd.Next(1, 13);
            dataGridView1.Rows[1].Cells[3].Value = 1;
            dataGridView1.Rows[1].Cells[4].Value = 201;
            
            dataGridView1.Rows[2].Cells[1].Value = 3;
            dataGridView1.Rows[2].Cells[2].Value = rnd.Next(1, 13);
            dataGridView1.Rows[2].Cells[3].Value = 1;
            dataGridView1.Rows[2].Cells[4].Value = 201;
            
            dataGridView1.Rows[3].Cells[1].Value = 4;
            dataGridView1.Rows[3].Cells[2].Value = rnd.Next(1, 13);
            dataGridView1.Rows[3].Cells[3].Value = 1;
            dataGridView1.Rows[3].Cells[4].Value = 201;
            
            dataGridView1.Rows[4].Cells[1].Value = 5;
            dataGridView1.Rows[4].Cells[2].Value = rnd.Next(1, 13);
            dataGridView1.Rows[4].Cells[3].Value = 1;
            dataGridView1.Rows[4].Cells[4].Value = 201;
            
            dataGridView1.Rows[5].Cells[1].Value = 6;
            dataGridView1.Rows[5].Cells[2].Value = rnd.Next(1, 13);
            dataGridView1.Rows[5].Cells[3].Value = 1;
            dataGridView1.Rows[5].Cells[4].Value = 201;
            
            dataGridView1.Rows[6].Cells[1].Value = 7;
            dataGridView1.Rows[6].Cells[2].Value = rnd.Next(1, 13);
            dataGridView1.Rows[6].Cells[3].Value = 1;
            dataGridView1.Rows[6].Cells[4].Value = 201;

This is the look of the dgv now: dgv

And this is the error the i get after combos stop working correctly (I click and no dropdown appear or if I click 2-3 times, a random item get selected but no video link appear in the other column):

error

Answer 1

In the posted code, it shows a query to a DB to get the exercise names and adds those names as the items to display in “each” combo box cell in that column. This is fine, however, there is zero (0) information about “which video” belongs to each of the items in the combo boxes list of items. I will assume the “relation” to which video is related to which exercise would involve another query to the DB.

If this is the case, then it is easy to see that when a combo box in the grid is changed, that you could simply query the DB for which video to use for the selected exercise. This would certainly work; however, it creates a redundancy issue. Example, let’s say the user selected “kicks” in the combo box in row 1 in the gird. The code queries the DB and gets the location of the “kicks” video and sets the “video” cell to this videos path. Then later, the user selects “kicks” again for some other row. This will re-query the DB for the SAME data we previously got. You want to avoid querying the DB unnecessarily.

So given this, it appears a better approach to avoid re-querying the DB unnecessarily, is that we somehow “combine” the exercise with the particular video that the exercise uses. You could do this ONCE when the form loads. Once you have the exercises, then loop though each exercise and query the DB for that exercises video and combine this with the exercise. Once we have the video link, we “save” this info. With this approach, you will not have to re-query the DB for any given exercise since we have saved that info for all exercises.

There are a myriad number of ways to “combine” the exercise with the video. One possible solution is to create a Class that has these two properties. Let’s call this Class ExerciseAndVideo… it has two properties, a string Exercise that is the exercise text and a string Video that defines the path to the video for that Exercise. This simple class may look something like…

public class ExerciseAndVideo {
  public string Exercise { get; set; }
  public string Video { get; set; }
}

This is one approach to “combine” an Exercise with a particular Video. We could then make a list of ExerciseAndVideo objects like…

List<ExerciseAndVideo> ExerciseList;

Then we cannot only use this list as a DataSource to the combo box column, but we could also use this list as a way to easily tell “which” video belongs to “which” exercise. The example below uses this strategy.

How to implement this in the DataGridView…

One thing to keep in mind is that a DataGridViewComboBoxCell is “different monster” than a “regular” ComboBox. Example; for a regular combo box, there is an event called… SelectedIndexChanged event. This event fires when the user “changes” the combo boxes currently selected index. On the other hand, a DataGridViewComboBoxCell does NOT have a SelectedIndexChanged event, which I assume you may be aware of. The grid’s absence of this event makes sense, because the grid’s combo box “column” may have MANY combo boxes in it.

Fortunately, even though the DataGridViewComboBoxCell does not have a SelectedIndexChanged event, we CAN cast an “individual” combo box cell to a ComboBox (in this case the combo box cell being edited), THEN we CAN subscribe to that ComboBoxes SelectedIndexChanged event. Then we could simply wait until the SelectedIndexChanged event fires then update the video cell data with the appropriate video link.

The DataGridView provides a special event for this called… EditingControlShowing. This event will fire when the user starts to “edit” a cell in the grid. In this particular case, this event would fire when the user clicks into a combo box cell and “starts” to change the cells value. Is what we want to do in this event is simply cast that combo box cell to a regular ComboBox…, THEN, subscribe to that ComboBoxes SelectedIndexChanged event which we will implement below.

The strategy goes like this… we will make a “global” ComboBox variable we will call curCombo. When the grids EditingControlShowing event fires and we see that the edited cell is an “Exercise” cell… Then we will cast THAT combo box cell in the grid to the global curCombo variable. Then we will subscribe to that combo boxes SelectedIndexChanged event. When the user “leaves” the cell we will unsubscribe from the global variables curCombo SelectedIndexChanged event to keep things clean.

Therefore, given this, the grids EditingControlShowing event may look something like below...

private void dataGridView1_EditingControlShowing(object sender, DataGridViewEditingControlShowingEventArgs e) {
  if (dataGridView1.Columns[dataGridView1.CurrentCell.ColumnIndex].Name == "Exercise") {
    curCombo = e.Control as ComboBox;
    if (curCombo != null) {
      curCombo.SelectedIndexChanged -= new EventHandler(curCombo_SelectedIndexChanged);
      curCombo.SelectedIndexChanged += new EventHandler(curCombo_SelectedIndexChanged);
    }
  }
}

Obviously we need to implement the event handler curCombo_SelectedIndexChanged. In this event, we would know that previously, the user selected a combo box cell and has changed the value in that cell to some other value. Since the Exercise changed, we know we need to change the “Video” cell.

Again there are numerous ways you could do this, however, if we set the grid’s “Exercise” combo box column’s DataSource as a List of ExerciseAndVideo objects, then we should be able to get that particular ExerciseAndVideo object directly from the global ComboBox curCombo. This will tell us “which” video to place in the “Video” cell. This may look something like…

private void curCombo_SelectedIndexChanged(object sender, EventArgs e) {
  if (curCombo != null && curCombo.SelectedValue != null) {
    ExerciseAndVideo selectedExercise = (ExerciseAndVideo)curCombo.SelectedItem;
    dataGridView1.CurrentRow.Cells["Video"].Value = selectedExercise.Video;
  }
}

private void dataGridView1_CellLeave(object sender, DataGridViewCellEventArgs e) {
  if (dataGridView1.Columns[e.ColumnIndex].Name == "Exercise") {
    if (curCombo != null) {
      curCombo.SelectedIndexChanged -= new EventHandler(curCombo_SelectedIndexChanged);
    }
  }
}

To complete the example and putting all this together may produce something like below…

List<ExerciseAndVideo> ExerciseList;
ComboBox curCombo;

public Form2() {
  InitializeComponent();
}

private void Form2_Load(object sender, EventArgs e) {
  ExerciseList = GetExerciseVideoComboBoxListFromDB();
  dataGridView1.Columns.Add(GetExcerciseComboBoxColumn(ExerciseList));
  dataGridView1.Columns.Add(GetLinkColumn());
  dataGridView1.CellLeave += new DataGridViewCellEventHandler(dataGridView1_CellLeave);
  dataGridView1.EditingControlShowing += new DataGridViewEditingControlShowingEventHandler(dataGridView1_EditingControlShowing);
}


private DataGridViewComboBoxColumn GetExcerciseComboBoxColumn(List<ExerciseAndVideo> exerciseData) {
  DataGridViewComboBoxColumn cbCol = new DataGridViewComboBoxColumn();
  cbCol.HeaderText = "Exercise";
  cbCol.Name = "Exercise";
  cbCol.DisplayMember = "Exercise";
  cbCol.DataSource = exerciseData;
  return cbCol;
}

private DataGridViewLinkColumn GetLinkColumn() {
  DataGridViewLinkColumn col = new DataGridViewLinkColumn();
  col.HeaderText = "Video";
  col.Name = "Video";
  col.AutoSizeMode = DataGridViewAutoSizeColumnMode.Fill;
  return col;
}

private List<ExerciseAndVideo> GetExerciseVideoComboBoxListFromDB() {
  List<ExerciseAndVideo> exerciseList = new List<ExerciseAndVideo>();
  exerciseList.Add(new ExerciseAndVideo { Exercise = "Crosses", Video = @"C:/somepath/Crosses.htm/" });
  exerciseList.Add(new ExerciseAndVideo { Exercise = "Kickback", Video = @"C:/somepath/Kickback.htm" });
  exerciseList.Add(new ExerciseAndVideo { Exercise = "Leg Extensions", Video = @"C:/somepath/LegExtensions.htm" });
  exerciseList.Add(new ExerciseAndVideo { Exercise = "Crunches", Video = @"C:/somepath/Crunches.htm" });
  exerciseList.Add(new ExerciseAndVideo { Exercise = "Pushups", Video = @"C:/somepath/Pushups.htm" });
  return exerciseList;
}

What if the grid has a data source?

This works as expected when the grid has no data source. However, if the grid has a data source and one of the columns/properties in the data source is bound to our “Exercise” combo box column, then, is what will happen… is that after the data is loaded, the combo boxes should display the proper exercise, however, all the video cells will remain empty. This is obviously because the grid events are not fired when the data is loaded.

So, in that case, you will want a method that loops through all the rows in the grid, checks what the exercise value is for that row, then set the video cell value to the correct video link. Since you do not say if the grid does or does not have a data source, I will assume this is all you need. If there is a data source, I recommend you check each “Exercise” to make sure the “Exercises” in the data are in the combo boxes list of items, if one or more “Exercises” are in the data that are not in the combo box columns list of items, then you will get the grids DataError when you attempt to set the grids data source.

I hope this makes sense.

Edit... An example of setting the video cell after the data has been loaded into the grid.

private void SetVideoCellsAfterDataLoad() {
  foreach (DataGridViewRow row in dataGridView1.Rows) {
    if (!row.IsNewRow && row.Cells["Exercise"].Value != null) {
      foreach (ExerciseAndVideo eav in ExerciseList) {
        if (row.Cells["Exercise"].Value.ToString() == eav.Exercise) {
          row.Cells["Video"].Value = eav.Video;
          break;
        }
      }
    }
  }
}

Answer 2

I mixed ComboBox with DatagridViewComboboxColumn. It's partly your fault :).

Here you have a form with events. Since CellValueChanged fires on cell exit, I added a Dirty StateEvent to update the Video column. From the designer, just put the datagrid in the form and make sure the name is the same. IMHO, these 3 events are crucial

public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();

            Init();
        }

        private void Init()
        {
            var list = new List<Exercise>() {
            new Exercise (){Name="Name1", Link= "Link1" },
            new Exercise (){Name="Name3", Link= "Link3" },
            new Exercise (){Name="Name4", Link= "Link4" },

            };

            var comboColumn = new DataGridViewComboBoxColumn() { Name = "ExerciseName", CellTemplate = new DataGridViewComboBoxCell() };
            comboColumn.DisplayMember = nameof(Exercise.Name);
            comboColumn.ValueMember = nameof(Exercise.Link);
            comboColumn.DataSource = list;
            
            dataGridView1.Columns.Add(comboColumn);
            dataGridView1.Columns.Add(new DataGridViewTextBoxColumn() { Name = "Video" });
            dataGridView1.CellContentClick += DataGridView1_CellContentClick;
            dataGridView1.CellValueChanged += DataGridView1_CellValueChanged;
            dataGridView1.CurrentCellDirtyStateChanged += DataGridView1_CurrentCellDirtyStateChanged;
        }

        private void DataGridView1_CurrentCellDirtyStateChanged(object sender, EventArgs e)
        {
            var currentCell = (sender as DataGridView).CurrentCell;
            if(currentCell.ColumnIndex == 0)
                dataGridView1.CommitEdit(DataGridViewDataErrorContexts.Commit);
            
        }

        private void DataGridView1_CellValueChanged(object sender, DataGridViewCellEventArgs e)
        {
            if (e.ColumnIndex != 0)
                return;
            var comboCell = (dataGridView1.Rows[e.RowIndex].Cells[0] as DataGridViewComboBoxCell);
            var value = comboCell.Value;
            dataGridView1.Rows[e.RowIndex].Cells["Video"].Value = value;

        }

        private void DataGridView1_CellContentClick(object sender, DataGridViewCellEventArgs e)
        {
            
        }
    }

    public class Exercise
    {
        public string Name { get; set; }
        public string Link { get; set; }
    }