Add text box with corresponding combo box dynamically

Question

I am creating a windows form app with the following goal:

get a list of products, each with a unique name and a category (from an enumerated list) from a user (and then do some things after, but this is not relevant to the question).

The idea is I would like to have the user specify they would like to configure "n" products by entering a value in a text box. I have the event handler for the text box calling a method which sets a variable to this value n. This value, "n", will be used as the loop counter, or what have you - the point is it will create the bound for the number of boxes to create.

I would then like to add (dynamically based on n), n number of (text box / combo box) pairs to the form. If there is no room to add another (text box / combo box) pair below the last one created, it should create another column.

n is unbounded, but, realistically, will likely never exceed 20. In any event, I'd like to be able to handle it if there are more products than this.

the options in the combo box will be filled from a string list that is passed in at run time, but will be consistent per box, per instance of this Form application.

i tried to enter a mock up image but stack overflow won't let me until i have earned some reputation points :(

I understand how to create a number of boxes using something like the code below, but its the finer points i'm stuck on. Can anyone help?

thanks!

`        private void Method1()
        {
            int boxes = Int32.Parse(NumProducts.Text);
            for (int i = 0; i < boxes; i++)
            {
                TextBox tb = new TextBox();
                tb.Location = new System.Drawing.Point(40, i * 20);
                tb.Name = "TextBoxName" + i.ToString();
                tb.Size = new System.Drawing.Size(184, 20);
                tb.TabIndex = i + 2;
                tb.Text = String.Empty;
                panel1.Controls.Add(tb);

            }
        }

        private void NumProducts_TextChanged(object sender, EventArgs e)
        {
            Method1();
        }`

Answer 1

Asking the user for the number of rows in advance is not very good from a usability viewpoint.

You should rather create an interface that keeps creating new boxes as the user inputs things, either by having a "new row" row that activates when the user types something into it (the empty row isn't saved) or by having a "new row" button.

Answer 2

To achieve the layout, use a FlowLayoutPanel control, and add the controls to this instead of to the panel as you are already doing. That should transparently take care of the columns issue, and add scroll bars if the user goes beyond your anticipated maximum number of edit boxes. General info on the FlowLayoutPanel here (as well as many others).

Answer 3

Sounds to me like a DataGridView would be the better choice here. You can configure it with a DataGridViewTextBoxColumn as the first column and a DataGridViewComboBoxColumn for the second. It supports a "new row" as the last item.

Read the docs. Drop one on a form and play with it.