如何通过@ Html.DropDownListFor正确设置选定状态

时间:2013-02-22 23:07:52

标签: asp.net asp.net-mvc asp.net-mvc-3 razor asp.net-mvc-4

我在我的视图中有这个下拉列表我正在尝试连接到我的MVC4 Web应用程序中的模型。

这是我的模型对象的属性:

    /// <summary>
    /// Used to provide values in the type drop down list in.
    /// </summary>
    public IEnumerable<SelectListItem> SomeTypes
    {
        get
        {
            var someTypeNames = new [] { "abc", "def", "xyz" };

            var someTypes = Enum.GetValues(typeof(ESomeType)).Cast<EsomeType>();
            var someTypesSelectItemsList = new List<SelectListItem>();
            someTypesSelectItemsList.Add(new SelectListItem()
            {
                Selected = true,
                Text = "Choose a type",
                Value = "-1"
            });
            foreach (var eSomeType in someTypes)
            {
                var sli = new SelectListItem()
                {
                    Selected = false,
                    Text = someTypeNames[(int)eSomeType],
                    Value = ((int)eSomeType).ToString()
                };
                someTypesSelectItemsList.Add(sli);
            }
            return someTypesSelectItemsList;
        }
        set { }
    }

以下是我将在我的视图中将我的下拉列表绑定到的模型属性:

[DataMember, Required]
[Display(Name = "Type:")]
public virtual int SomeType { get; set; }

然后我在我看来打印这个:

@Html.LabelFor(m => m.SomeType)
@Html.DropDownListFor(m => m.SomeType, new SelectList(Model.SomeTypes, "Value", "Text"), new { ng_model = "type", ng_change = "ChangeType()" })
@Html.ValidationMessageFor(m => m.SomeType)

现在一切正常(我稍后会重构),但我的问题是渲染的html:

<label for="SomeType">Type:</label>
<select data-val="true" data-val-number="The field Type: must be a number." data-val-required="The Type: field is required." id="SomeType" name="SomeType" ng-change="ChangeType()" ng-model="type">
    <option value="-1">Choose a type</option>
    <option selected="selected" value="0">abc</option>
    <option value="1">def</option>
    <option value="2">xyz</option>
</select>
<span class="field-validation-valid" data-valmsg-for="SomeTypeType" data-valmsg-replace="true"></span>

正如您所看到的,“abc”选项被选中=“选中”而不是我的“选择类型”选项,我们可以清楚地看到我的模型中的代码设置了正确的选择。这是怎么回事?

感谢您的帮助!!

1 个答案:

答案 0 :(得分:2)

当模型绑定变量与选择列表同名时,会发生此问题。

尝试将SelectList的名称更改为 SomeTypesList

在你模型

public IEnumerable<SelectListItem> SomeTypesList

并在查看

@Html.DropDownListFor(m => m.SomeType, 
                      new SelectList(Model.SomeTypesList, "Value", "Text"),
                      new { ng_model = "type", ng_change = "ChangeType()" },
                      "Choose a type"}

后续注释:您在选择列表中设置默认值而非助手