3

I have problems to set the default selected value of a DropDownList with DropDownListFor in ASP MVC 4.

When the property which I want to preselect is in a list it's never selected by default as expected.

Here is my code reduced to the important stuff:

Models:

public class Renter
{
    ...
    public virtual List<RentLine> RentLines { get; set; }
    ...

    public Renter()
    {
        ...
        RentLines = new List<RentLine>();
        ...
    }
}

public class RentLine
{
    ...
    public Guid RenterId { get; set; }
    public virtual Renter Renter { get; set; }  
    public Guid GarageId { get; set; }
    public virtual Garage Garage { get; set; }
    ...

    public RentLine()
    {
        //
        // Testcase for default value in dropdownlist
        //
        GarageId = new Guid("e926dcac-05ac-4fc1-92a2-014345e6e11c");
    }
}

Controller:

public ActionResult Hinzufuegen()
{
    var model = new AddRenterViewModel();
    return View(model);
}

ViewModel:

public class AddRenterViewModel
{
    public Renter Renter { get; set; }

    public List<SelectListItem> RentableGarageItems { get; set; }

    ...

    public AddRenterViewModel()
    {
        Renter = new Renter();
        Renter.RentLines.Add(new RentLine());

        RentableGarageItems = new List<SelectListItem>();
        foreach (var garage in Singleton.Instance.Entities.GetRentableGarages().OrderBy(g => g.No))
        {
            RentableGarageItems.Add(new SelectListItem{Text = garage.No.ToString(), Value = garage.Id.ToString()});
        }
    }   
}

View:

@model Grossgaragenverwaltung.ViewModels.AddRenterViewModel
...
Garage Nr. @Html.DropDownListFor(m => m.Renter.RentLines[0].GarageId, Model.RentableGarageItems) @* No selected value *@
           @Html.TextBoxFor(m => m.Renter.RentLines[0].GarageId) @* Shows the id 'e926dcac-05ac-4fc1-92a2-014345e6e11c' as set in the constructor *@
...

Here is the result, no selected value:

Garage Nr.
<select id="Renter_RentLines_0__GarageId" name="Renter.RentLines[0].GarageId" data-val-required="Das Feld "GarageId" ist erforderlich." data-val="true">
<option value="225a761d-7d12-4e02-9d72-d54fb6934f05">1</option>
<option value="d28fb4fb-d65b-4674-90d6-a4ab9636be80">2</option>
<option value="e06b520b-e876-4870-b321-dc65f77967a7">3</option>
<option value="56832d98-aa5a-4e1a-af44-2d7e00f2bb3a">4</option>
<option value="551f1fa9-13a5-40ce-b795-50063e605027">5</option>
<option value="bace4b40-92ab-4757-9716-2a2878c2c9e8">6</option>
<option value="f9baf45b-96bf-463e-a234-a1522bfc9b9b">7</option>
<option value="91d1d866-6346-4ab0-b2aa-35b56eeaf2b0">8</option>
<option value="62eb3727-eab2-4180-90cd-7dc59119f44e">9</option>
<option value="59768097-c772-4421-b907-a24397a106f5">10</option>
<option value="270acf6b-e4e3-41c3-86dd-4381a313848a">11</option>
<option value="923269cd-1ead-4346-90ce-6344acda5b1b">12</option>
<option value="981ee61e-408b-4b08-a7d3-26c909f04a9d">13</option>
<option value="f1c5043c-fe41-4a8e-8c58-e88363885de4">14</option>
<option value="e926dcac-05ac-4fc1-92a2-014345e6e11c">15</option>
<option value="5577dc00-7cfa-4bcd-99ad-3f356e4325ae">16</option>
</select>
<input id="Renter_RentLines_0__GarageId" type="text" value="e926dcac-05ac-4fc1-92a2-014345e6e11c" name="Renter.RentLines[0].GarageId">

How can i get this work?

UPDATE: Here is a working example where everything works like expected, the problem occurs only in the case you see above:

public class Renter
{
    ...
    public Salutation Salutation { get; set; }
    ...

    public Renter()
    {
        ...
        Salutation = Salutation.Male;
        ...
    }
}

public ActionResult Hinzufuegen()
{
    var model = new AddRenterViewModel();
    return View(model);
}

public class AddRenterViewModel
{
    public Renter Renter { get; set; }

    public List&lt;SelectListItem&gt; SalutationItems { get; set; }

    ...

    public AddRenterViewModel()
    {
        Renter = new Renter();
        Renter.RentLines.Add(new RentLine());

        SalutationItems = new List&lt;SelectListItem&gt;();
        foreach (Salutation salutation in Enum.GetValues(typeof(Salutation)))
        {
           SalutationItems.Add(new SelectListItem { Text = NameEnum.GetName(salutation), Value = salutation.ToString() });
        }
    }   
}

@Html.DropDownListFor(m =&gt; m.Renter.Salutation, Model.SalutationItems)

&lt;select id="Renter_Salutation" name="Renter.Salutation" data-val-required="Das Feld "Salutation" ist erforderlich." data-val="true"&gt;
&lt;option value="Company"&gt;Firma&lt;/option&gt;
&lt;option value="Male" selected="selected"&gt;Männlich&lt;/option&gt;
&lt;option value="Female"&gt;Weiblich&lt;/option&gt;
&lt;/select&gt;
Barney
  • 2,355
  • 3
  • 22
  • 37
user3116990
  • 121
  • 1
  • 6

3 Answers3

9

After some research here dropdownlistfor does not select correct value in a loop I found a solution.

This works:

@Html.DropDownListFor(m => m.Renter.RentLines[0].GarageId,
  new SelectList(Model.RentableGarageItems, "Value", "Text", Model.Renter.RentLines[0].GarageId))
Community
  • 1
  • 1
user3116990
  • 121
  • 1
  • 6
2

You missing the Selected property in the SelectedListItem creation. i.e Selected = (garage.Id == 2)

        var entities = new List<Guarage>()
        {
            new Guarage() {No = 1, Id = 1},
            new Guarage() {No = 2, Id = 2},
            new Guarage() {No = 3, Id = 3}
        };

        foreach (var garage in entities)
        {
            var s = new SelectListItem
            {
                Text = garage.No.ToString(),
                Value = garage.Id.ToString(),
                Selected = (garage.Id == 2)
            };
            RentableGarageItems.Add(s);
        }

This would have the 2 selected in the dropdown by default.

enter image description here

Spock
  • 7,009
  • 1
  • 41
  • 60
  • 1
    Thanks for the reply. That's works but it must be able to it without setting the selected value in a List of SelectListItems for two reasons: 1. I want to use the same list for more than on DropDownList with different preselected values. 2. It works perfect until I want to pre select from a property "deeper" in my model object. Please take a look at my updated post above. (Can't sent as comment, because it's to long). Here it works without setting the select value in the List of SelectListItems. – user3116990 Dec 19 '13 at 12:54
1

Inlining Stephen Muecke's answer to MVC5 Razor html.dropdownlistfor set selected when value is in array

Unfortunately @Html.DropDownListFor() behaves a little differently than other helpers when rendering controls in a loop. This has been previously reported as an issue on CodePlex (not sure if its a bug or just a limitation)

The are 2 options to solve this to ensure the correct option is selected based on the model property


Option 1 - Use an EditorTemplate

Create a custom EditorTemplate for the type in the collection. Create a partial in /Views/Shared/EditorTemplates/AggregationLevelConfiguration.cshtml (note the name must match the name of the type

@model yourAssembly.AggregationLevelConfiguration
@Html.DropDownListFor(m => m.HelperCodeType, (SelectList)ViewData["CodeTypeItems"])
.... // other properties of AggregationLevelConfiguration

and then in the main view, pass the SelectList to the EditorTemplate as additionalViewData

@using (Html.BeginForm())
{
  ...
  @Html.EditorFor(m => m.Configurations , new { CodeTypeItems = Model.CodeTypeItems })
  ...

Option 2 - Generate a new SelectList in each iteration and set the selectedValue

In this option your property CodeTypeItems should to be IEnumerable<GenericIdNameType>, not a SelectList (or just make codeTypes a public property). Then in the main view

@Html.DropDownListFor(m => m.Configurations[0].HelperCodeType, new SelectList(Model.CodeTypeItems, "Id", "Name", Model.Configurations[0].HelperCodeType)

Side note: there is no need to use new { id = "Configurations[0].HelperCodeType" - the DropDownListFor() method already generated that id attribute

Note: Also double check that you don't have other non-list related binding issues as described in these questions:

KyleMit
  • 30,350
  • 66
  • 462
  • 664