@ Html.DropDownList宽度

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;" } 
) 

，最后以避免与风格弄乱你的HTML，你应该使用一个外部CSS：

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

凡在你的外部CSS，你会定义.mycombo规则：

.mycombo { 
    width: 250px; 
} 

现在你有我认为正确的代码。

Answer 2

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

Answer 3

有一个jQuery技术，可以让你设置宽度而不必处理@ Html.DropDownList构造函数。

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

Answer 4

您应该使用视图模型方法。然而懒惰的出路只是为了让第二个参数为空。

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