Html.DropDownList - 如何添加额外的 <option> 到列表

Posted 2023-03-05

【中文标题】Html.DropDownList - 如何添加额外的 <option> 到列表

【英文标题】：Html.DropDownList - How to add extra <option> to list

【发布时间】：2012-03-25 19:24:28

【问题描述】：

我正在使用html.DropDownList 来创建一个像这样的选项列表

Html.DropDownList("LogType", new SelectList(Model.LogTypeList, "ID", "Name", Model.SelectedLogType),"-- ALL --");

如您所见，我传递了一个列表，但也传递了一个额外的参数来添加一个额外的选项："-- All --"。结果如下：

<select name="LogType" id="LogType">
<option value="">-- ALL -- </option>
<option value="1">Debug</option>
<option value="2" selected="selected">Error</option>
</select>

如何给-- All -- 赋值0 而无需自己手动构建下拉列表？

【问题讨论】：

这个问题已经在***.com/a/581944/476786回答了

How do I set a value for the default option with Html.DropDownList的可能重复

【参考方案1】：

我不确定，但是，为什么不在@html.DropDownList 之前构建列表

var myList = new SelectList(Model.LogTypeList, "ID", "Name", Model.SelectedLogType);

然后将所需的项目附加到它。

var myList.add(new selectItem("-- ALL --",0));

最后将它传递给你的语法，看看会产生什么结果

Html.DropDownList("LogType",myList);

抱歉，这是使用我的 iPhone 的快速回答，不确定它是否能解决您的问题，但我已尽力提供帮助。

【参考方案2】：

我之前尝试过这样做并以使用 jQuery 结束：

$("#LogType").append($("<option />").val("0").html("-- All --"));

【参考方案3】：

只是对于不同的方法，我很惊讶论坛上有多少关于同一个问题的答案，所有这些似乎都过于复杂，因为可以在 WebForms 中使用 AppendDataItems 轻松实现（当然，它 是 网络表单！）。

刚才对我来说效果很好，保持所有内容内联并将视图和模型关注点分开：

@Html.DropDownListFor(model => model.Operators,
                new SelectList(new[]  
                    new id=-1, name="Please select an operator"
                    .Union(Model.Operators
                            .Select( o=> new  id=o.Id, name=o.Name)
                    ), "id", "name")) 

呈现为：

<select id="Operators" name="Operators">
    <option value="-1">Please select an operator</option>
    <option value="1">Tony Bolton</option>
    <option value="2">Joe Bloggs</option>
</select>

虽然没有检查性能等，但觉得值得分享。