Question

问：如何为@ Html.DropDownList设置宽度（而不是在css中）？

@Html.DropDownList("ListId", String.Empty, new {style="width: 250px;"})  @* no go!*@

Answer 1

DropDownList助手的第二个参数必须是IEnumerable<SelectListItem>。您正在传递一个字符串（一个空字符串更精确）。因此，为了使用这个助手，你必须尊重它的签名：

@Html.DropDownList(
    "ListId", 
    Enumerable.Empty<SelectListItem>(), 
    new { style = "width: 250px;" }
)

显然，生成一个空的下拉列表几乎没用。你可能有一个你想要用来绑定的视图模型（顺便提一下）：

@Html.DropDownList(
    "ListId", 
    Model.MyList, 
    new { style = "width: 250px;" }
)

当然因为你有一个视图模型，所以你应该更喜欢使用DropDownListFor帮助器：

@Html.DropDownListFor(
    x => x.ListId, 
    Model.MyList, 
    new { style = "width: 250px;" }
)

最后为了避免使用外部CSS的样式混乱你的HTML：

@Html.DropDownListFor(
    x => x.ListId, 
    Model.MyList, 
    new { @class = "mycombo" }
)

在外部CSS中，您将定义.mycombo规则：

.mycombo {
    width: 250px;
}

现在你拥有我认为合适的代码。

Answer 2

您应该使用View Model方法。然而，懒惰的出路只是给第二个参数一个null。

@Html.DropDownList("ListId", null, new {style="width: 250px;"})

Answer 3

 @Html.DropDownListFor(model => model.Test,
 new SelectList(new List<YourNamespace.Modelname>(), "Id", "Name"), 
 null, new { @id = "ddlTest", @style="width: 250px;" })

Answer 4

有一种jquery技术允许你设置宽度而不必处理@ Html.DropDownList构造函数。

<script language="javascript" type="text/javascript">
    $(document).ready(function () {
        $("#ListId").width(300);
    });
</script>

@ Html.DropDownList宽度

4 个答案: