ASP.NET MVC variable number of dropdown lists

Question

Consider the following question and potential answer: ASP.Net MVC Multiple Drop Downs, Single List, Only Allow Unique Selections

Ignoring most of the details, we can see that we can implement many dropdowns for a 1-m relationship like this:

<%: Html.DropDownListFor(model => model.DropwdownId1,Model.DropdownEntities) %>
<%: Html.DropDownListFor(model => model.DropwdownId2,Model.DropdownEntities) %>
<%: Html.DropDownListFor(model => model.DropwdownId3,Model.DropdownEntities) %>

DropdownId1, DropdownId2 and DropdownId3 are properties easily added to the model if and only if we know exactly how many dropdowns we are going to display and postback. However, I would like to implement a variable number of dropdowns. New dropdowns could, for example, be added dynamically by Javascript. Or the number of dropdowns displayed into the view could be dependent on some variable Property in model. say, model.NumberOfDropDowns.

How can I implement this? How do I write a viewmodel, and controller action that can handle a variable number of dropdowns?

I have done a lot of reading on complex things like editor templates and blog posts where form elements are added dynamically, but I'm really having difficulty trying to figure out how this could be done. Any assistance would be greatly appreciated

Is your question how to dynamically add dropdowns using JavaScript? — George Stocker
– George Stocker, Commented Feb 17, 2015 at 20:58
No, my question is how to implement a view-model and postback controller to handle a variable number of dropdowns. This is why I also provided an example where we use model.NumberOfDropDowns which decides how many dropdowns are created in the view. — Matthew Holmes
– Matthew Holmes, Commented Feb 17, 2015 at 21:00
Oh; OK. Good news is that we don't have postbacks in ASP.NET MVC, so you don't have to worry about that. Since your question is binding multiple values to a Controller Action, it'd help if you could edit your question to make that clear. — George Stocker
– George Stocker, Commented Feb 17, 2015 at 21:01
This would require a custom implementation. There are many ways to accomplish this task. — Travis J
– Travis J, Commented Feb 17, 2015 at 21:01
@TravisJ, could you please elaborate on the many ways? I don't expect a full on tutorial, but an explanation on what I should be googling could help — Matthew Holmes
– Matthew Holmes, Commented Feb 17, 2015 at 21:08

BLoB · Accepted Answer · 2016-09-28 13:06:03Z

A drop-down input still has only 1 submitted form value, so it's the same as any other variable-length view-model property: use a List<T>, like so:

ViewModel

class FooViewModel {
    public List<String> DropDownFields { get; set; }
}

Controller Actions

[HttpGet]
ActionResult Index() {

    ViewData["dropDownSource"] = new List<SelectListItem>
              {
                   new SelectListItem
                   {
                        Text = "Test",
                        Value= "1"
                   },
                   new SelectListItem
                   {
                        Text = "Text",
                        Value= "2"
                   }
              };

    return View( new FooViewModel() );
}

[HttpPost]
ActionResult Index(FooViewModel vm) {

    for(int i = 0; i < vm.DropDownFields.Count; i++) {

        // for each dropdown
    }
}

View (aspx syntax)

<% for(int i = 0; i < vm.DropDownFields.Count; i++) { %>
    <%= Html.DropDownListFor( m => m.DropDownFields[i], (IEnumerable<SelectListItem>)ViewData["dropDownSource"] ) %>
<% } %>

Collectives™ on Stack Overflow

ASP.NET MVC variable number of dropdown lists

1 Answer 1

ViewModel

Controller Actions

View (aspx syntax)

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

ViewModel

Controller Actions

View (aspx syntax)

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related